/**
 * Brand match: align Mock-Quiz-Expert chrome with clarityft.co.uk
 * Colors, fonts, header, footer, page background only — no menu/copy changes.
 */
:root {
  --cft-primary: #077B86;
  --cft-secondary: #FF4C8F;
  --cft-secondary-soft: #F787A8;
  --cft-text: #000000;
  --cft-muted: #424242;
  --cft-bg: #FFFFFF;
  --cft-bg-soft: #F0F7F8;
  --cft-teal: #077B86;
  --cft-cyan: #077B86;
  --cft-coral: #FF4C8F;
  --cft-deep: #000000;
  --cft-ink: #424242;
  --cft-pale-teal: #F0F7F8;
  --cft-font: "Nunito Sans", sans-serif;
  --cft-h1-size: 36px;
  --cft-h1-weight: 800;
  --cft-h2-size: 26px;
  --cft-h2-weight: 700;
  --cft-h3-size: 20px;
  --cft-h3-weight: 700;
  --cft-subh-size: 18px;
  --cft-subh-weight: 600;
  --cft-para-size: 17px;
  --cft-para-weight: 400;
  --cft-small-size: 15px;
  --cft-small-weight: 400;
  --cft-navy: #077B86;
  --cft-teal-mid: #077B86;
  --cft-cyan-soft: #70B2BA;
}

/* Exact typography lock from clarityft.co.uk */
html body,
html body button,
html body input,
html body select,
html body textarea,
html body .site_content,
html body .entry-content,
html body .wrapper,
html body #content,
html body .tabcontent,
html body .cft-home,
html body .cft-content-panel,
html body .cft-calc-page {
  font-family: "Nunito Sans", sans-serif !important;
}

html body,
html body .wrapper,
html body #main.wrapper {
  font-size: var(--cft-para-size) !important;
  font-weight: var(--cft-para-weight) !important;
  line-height: 1.55 !important;
  color: #424242 !important;
  background: #FFFFFF !important;
}

body.home .wrapper {
  background: #FFFFFF !important;
}

html body h1,
html body .entry-content h1,
html body .cft-home-title,
html body .cft-content-hero:not(.cft-page-hero) h1,
html body #post-title h2 {
  font-family: "Nunito Sans", sans-serif !important;
  font-size: var(--cft-h1-size) !important;
  font-weight: var(--cft-h1-weight) !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-shadow: none !important;
  color: #077B86 !important;
}

html body h2,
html body .entry-content h2,
html body .cft-home-section-head h2,
html body .cft-home-coverage-copy h2,
html body .cft-home-trust-inner h2,
html body .cft-content-panel h2,
html body .cft-calc-page-hero h2,
html body .cft-calc-page .tabtitle,
html body .tool-title,
html body .faqAccordion .accTrigger,
html body #footer.cft-footer .widget-title,
html body #footer.cft-footer h3.widget-title {
  font-family: "Nunito Sans", sans-serif !important;
  font-size: var(--cft-h2-size) !important;
  font-weight: var(--cft-h2-weight) !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-shadow: none !important;
  color: #077B86 !important;
}

html body h3,
html body .entry-content h3,
html body .cft-home-path h3,
html body .cft-home-feature h3,
html body .cft-content-panel h3,
html body .cft-home-brand {
  font-family: "Nunito Sans", sans-serif !important;
  font-size: var(--cft-h3-size) !important;
  font-weight: var(--cft-h3-weight) !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-shadow: none !important;
  color: #077B86 !important;
}

html body h4,
html body h5,
html body h6,
html body .entry-content h4,
html body .entry-title,
html body .page-title,
html body .widget-title {
  font-family: "Nunito Sans", sans-serif !important;
  font-size: var(--cft-subh-size) !important;
  font-weight: var(--cft-subh-weight) !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-shadow: none !important;
  color: #000000 !important;
}

html body p,
html body .entry-content p,
html body .entry-summary p,
html body li,
html body .entry-content li,
html body label,
html body .cft-home-section-head p,
html body .cft-home-path p,
html body .cft-home-feature p,
html body .cft-home-coverage-copy p,
html body .cft-home-trust-inner > p,
html body .cft-home-lead,
html body .cft-content-hero-lead,
html body .cft-calc-page-hero p {
  font-family: "Nunito Sans", sans-serif !important;
  font-size: var(--cft-para-size) !important;
  font-weight: var(--cft-para-weight) !important;
  line-height: 1.55 !important;
  color: #424242 !important;
}

html body small,
html body .cft-home-brand span,
html body .cft-home-trust-eyebrow,
html body .cft-content-badge,
html body .cft-calc-badge {
  font-family: "Nunito Sans", sans-serif !important;
  font-size: var(--cft-small-size) !important;
  font-weight: var(--cft-small-weight) !important;
  line-height: 1.45 !important;
  color: #424242 !important;
}

/* Kill leftover neon cyan / ethnocentric title colors */
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body .entry-content h1,
html body .entry-content h2,
html body .entry-content h3,
html body .entry-content h4,
html body .cft-content-panel h1,
html body .cft-content-panel h2,
html body .cft-content-panel h3,
html body .cft-content-panel h4,
html body .cft-content-hero:not(.cft-page-hero) h1,
html body .cft-home-section-head h2,
html body .cft-home-path h3,
html body .cft-home-feature h3,
html body .cft-home-coverage-copy h2,
html body .cft-home-trust-inner h2,
html body .cft-home-title,
html body .cft-home-brand,
html body #post-title h2,
html body .tool-title,
html body .faqAccordion .accTrigger {
  color: #077B86 !important;
  font-family: "Nunito Sans", sans-serif !important;
}

/* Hero copy: forced white (overrides global teal headings) */
html body .cft-home-hero .cft-home-brand,
html body .cft-home-hero .cft-home-title,
html body .cft-home-hero .cft-home-lead,
html body .cft-home-hero .cft-home-brand span,
html body .cft-home-hero .cft-home-eyebrow,
html body .cft-page-hero h1,
html body .cft-page-hero .cft-page-hero-title,
html body .cft-content-hero.cft-page-hero h1 {
  color: #FFFFFF !important;
}

/* FAQ + content lists must stay dark on white */
html body .faqAccordion .accTrigger,
html body .cft-content-panel .faqAccordion .accTrigger,
html body.cft-is-content .faqAccordion .accTrigger {
  color: #077B86 !important;
  font-family: "Nunito Sans", sans-serif !important;
  font-weight: 700 !important;
}

html body .faqAccordion .accTrigger:hover,
html body .faqAccordion .accTrigger.active {
  color: #FF4C8F !important;
}

html body .faqAccordion .accTrigger.active {
  color: #077B86 !important;
}

html body .cft-content-panel p,
html body .cft-content-panel li,
html body .cft-content-panel ul,
html body .cft-content-panel ol,
html body .entry-content li,
html body .faqAccordion .accordDetail,
html body .faqAccordion .accordDetail p,
html body .faqAccordion .accordDetail li {
  color: #424242 !important;
}

html body .cft-content-panel ul > li:before {
  background: #077B86 !important;
}

html body .cft-content-panel a {
  color: #FF4C8F !important;
}

html body .cft-content-panel h4,
html body .faqAccordion .accordDetail h4 {
  color: #077B86 !important;
}

/* —— Header: white full-width band like clarityft —— */
#header,
#header.header-inner {
  position: relative !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background: #FFFFFF !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  z-index: 1000 !important;
}

#header.header-inner::after {
  display: none !important;
}

#header > .container {
  max-width: 1360px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
  position: relative !important;
  z-index: 2 !important;
}

body.home #header.header-inner {
  height: auto !important;
  min-height: 0 !important;
  padding-bottom: 0 !important;
  background: #FFFFFF !important;
  background-image: none !important;
}

/* Kill gap between nav and page hero / content */
html body #main.wrapper,
html body .wrapper {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

html body .site_content.content-section,
html body.cft-is-content .site_content.content-section,
html body.cft-is-purchase-hub .site_content.content-section,
html body.cft-is-calculator .site_content.content-section {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

html body.cft-is-content .entry-header,
html body.cft-is-purchase-hub .entry-header,
html body.page .entry-header {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
}

html body .cft-page-hero,
html body .cft-content-hero.cft-page-hero {
  margin-top: 0 !important;
}

.cft-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  max-width: 1360px !important;
  margin: 0 auto !important;
  padding: 8px 8px !important;
  min-height: 58px !important;
  background: #FFFFFF !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.cft-bar .logo {
  flex: 0 0 auto !important;
  max-width: none !important;
}

.cft-bar .logo img {
  max-height: 44px !important;
  max-width: 160px !important;
}

.cft-nav-toggle {
  border: 1px solid #2A2A2A !important;
  background: #FFFFFF !important;
  color: #2A2A2A !important;
  border-radius: 8px !important;
}

.cft-nav-toggle:hover,
.cft-nav-toggle[aria-expanded="true"] {
  background: #2A2A2A !important;
  border-color: #2A2A2A !important;
  color: #FFFFFF !important;
}

.topnav a {
  font-family: "Nunito Sans", sans-serif !important;
  font-weight: 600 !important;
  font-size: clamp(12px, 1vw, 14px) !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  color: #2A2A2A !important;
  background: transparent !important;
  border-radius: 5px !important;
  padding: 10px clamp(6px, 0.78vw, 13px) !important;
  transform: none !important;
}

.topnav a::after {
  display: none !important;
  content: none !important;
}

.topnav a:hover,
.topnav a:focus,
.topnav a.active {
  color: #FFFFFF !important;
  background: rgb(112, 178, 186) !important;
  transform: none !important;
}

.cft-bar .callus {
  display: flex !important;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  align-self: center !important;
  flex: 0 0 auto !important;
  margin: 0 0 0 10px !important;
  padding: 0 0 0 14px !important;
  border-left: 1px solid #E0E0E0;
  color: #2A2A2A !important;
  text-align: right;
  line-height: 1.2;
}

.cft-bar .callus > span.tel {
  display: inline-flex !important;
  flex-direction: row;
  align-items: center;
  margin: 0 !important;
  line-height: 1.2 !important;
}

.cft-bar .callus a {
  color: #077B86 !important;
  font-weight: 700 !important;
  font-family: "Nunito Sans", sans-serif !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.01em;
  white-space: nowrap;
  background: transparent !important;
  padding: 0 !important;
}

/* Hours live in the mobile menu only — desktop header stays a single phone line */
.cft-bar .callus small {
  display: none !important;
}

/* Logged-in nav already has My Account + My Mocks — hide phone to avoid crowding */
body.logged-in .cft-bar .callus {
  display: none !important;
}

#post-title {
  padding: 18px 0 8px !important;
  text-align: left !important;
}

#post-title h2 {
  color: #077B86 !important;
  font-size: 28px !important;
  font-weight: 800 !important;
}

/* Mobile nav panel */
@media screen and (max-width: 991px) {
  #cftNav.cft-nav {
    background: #FFFFFF !important;
    border: 1px solid #E0E0E0 !important;
    box-shadow: 0 16px 28px rgba(0, 0, 0, 0.12) !important;
  }

  .topnav a {
    color: #2A2A2A !important;
    background: transparent !important;
    text-transform: none !important;
    font-weight: 700 !important;
  }

  .topnav a:hover,
  .topnav a.active {
    background: #F5F5F5 !important;
    color: #2A2A2A !important;
  }

  .cft-mobile-phone a {
    color: #077B86 !important;
  }

  .cft-mobile-phone small {
    color: #8a8a8a !important;
  }
}

/* —— Site content background —— */
.site_content.content-section,
#content,
.entry-content,
body .site_content {
  background: transparent !important;
  color: #424242 !important;
}

body.home .site_content.content-section {
  margin-top: 0 !important;
}

/* —— Homepage —— */
.cft-home {
  color: #424242 !important;
  font-family: "Nunito Sans", sans-serif !important;
}

/* Full-bleed hero — break out of .container like clarityft.co.uk */
.cft-home-hero {
  position: relative !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 0 40px !important;
  min-height: clamp(480px, 72vh, 640px) !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  overflow: hidden !important;
}

body.home .site_content.content-section,
body.home #content,
body.home .entry-content,
body.home article,
body.home .wrapper > .container {
  overflow: visible !important;
}

.cft-home-hero-bg {
  background-position: 78% center !important;
  background-size: cover !important;
  filter: contrast(1.08) saturate(1.1) !important;
  transform: scale(1.02) !important;
}

/* Deep teal wash left → photo reveals right (white type stays crisp) */
.cft-home-hero-bg::after {
  mix-blend-mode: normal !important;
  background:
    linear-gradient(
      100deg,
      rgba(2, 42, 48, 0.97) 0%,
      rgba(4, 62, 70, 0.94) 28%,
      rgba(7, 100, 110, 0.82) 48%,
      rgba(7, 123, 134, 0.45) 68%,
      rgba(7, 123, 134, 0.12) 84%,
      transparent 100%
    ) !important;
}

.cft-home-hero-shade {
  background:
    linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.22) 36%,
      rgba(0, 0, 0, 0.06) 58%,
      transparent 78%
    ) !important;
  z-index: 1 !important;
}

html body .cft-home-hero-inner {
  position: relative;
  z-index: 2;
  max-width: 640px !important;
  width: min(640px, calc(100% - 48px)) !important;
  margin: 0 auto 0 max(24px, calc((100% - 1170px) / 2 + 24px)) !important;
  padding: clamp(52px, 9vw, 96px) clamp(24px, 4vw, 36px) !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  animation: cftHeroIn 0.75s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes cftHeroIn {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

html body .cft-home-eyebrow {
  display: inline-block !important;
  margin: 0 0 18px !important;
  padding: 7px 14px !important;
  border-radius: 4px !important;
  background: rgba(255, 76, 143, 0.22) !important;
  border: 1px solid rgba(255, 76, 143, 0.55) !important;
  color: #FFFFFF !important;
  font-family: "Nunito Sans", sans-serif !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  line-height: 1.2 !important;
  text-shadow: none !important;
}

html body .cft-home-hero .cft-home-brand,
html body .cft-home-hero .cft-home-title,
html body .cft-home-hero .cft-home-lead,
html body .cft-home-hero .cft-home-brand span,
html body .cft-home-hero .cft-home-eyebrow {
  color: #FFFFFF !important;
}

html body .cft-home-hero .cft-home-brand {
  margin: 0 0 14px !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
  display: block !important;
  max-width: 100% !important;
  font-size: clamp(32px, 5.2vw, 52px) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.4) !important;
}

html body .cft-home-hero .cft-home-brand::after {
  content: "";
  display: block;
  width: 72px;
  height: 3px;
  margin-top: 14px;
  background: #FF4C8F;
  border-radius: 2px;
}

html body .cft-home-hero .cft-home-brand span {
  display: block !important;
  margin-top: 10px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.9) !important;
  text-shadow: none !important;
  border: 0 !important;
}

html body .cft-home-hero .cft-home-title {
  margin: 18px 0 16px !important;
  max-width: none !important;
  font-size: clamp(26px, 3.8vw, 40px) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  color: #FFFFFF !important;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.35) !important;
}

html body .cft-home-hero .cft-home-lead {
  margin: 0 0 30px !important;
  max-width: 34em !important;
  font-size: clamp(16px, 1.4vw, 18px) !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  color: rgba(255, 255, 255, 0.95) !important;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.3) !important;
}

html body .cft-home-hero .cft-home-btn {
  min-height: 52px !important;
  padding: 14px 28px !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28) !important;
  transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease !important;
}

html body .cft-home-hero .cft-home-btn-primary {
  background: #FF4C8F !important;
  border: 1px solid #FF4C8F !important;
  color: #FFFFFF !important;
}

html body .cft-home-hero .cft-home-btn-primary:hover {
  background: #2A2A2A !important;
  border-color: #2A2A2A !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
}

html body .cft-home-hero .cft-home-btn-ghost {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 2px solid #FFFFFF !important;
  color: #FFFFFF !important;
  backdrop-filter: none !important;
}

html body .cft-home-hero .cft-home-btn-ghost:hover {
  background: #FFFFFF !important;
  color: #077B86 !important;
  border-color: #FFFFFF !important;
}

@media (max-width: 767px) {
  .cft-home-hero {
    min-height: 520px !important;
  }

  html body .cft-home-hero-inner {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    margin: 0 16px !important;
    padding: 40px 0 48px !important;
  }

  .cft-home-hero-bg::after {
    background:
      linear-gradient(
        180deg,
        rgba(2, 42, 48, 0.94) 0%,
        rgba(4, 62, 70, 0.9) 55%,
        rgba(7, 100, 110, 0.72) 100%
      ) !important;
  }
}

/* Remove redundant "Online Mocks" bar under the menu (all pages) */
#post-title,
a[href="#main"] > #post-title {
  display: none !important;
}

.cft-home-lead {
  color: rgba(255, 255, 255, 0.92) !important;
}

.cft-home-btn {
  font-family: "Nunito Sans", sans-serif !important;
  border-radius: 6px !important;
  letter-spacing: 0.02em !important;
}

.cft-home-btn-primary {
  background: #FF4C8F !important;
  color: #FFFFFF !important;
  box-shadow: none !important;
  border: 1px solid #FF4C8F !important;
}

.cft-home-btn-primary:hover {
  background: #2A2A2A !important;
  border-color: #2A2A2A !important;
  color: #FFFFFF !important;
}

.cft-home-btn-ghost {
  background: transparent !important;
  border-color: #FFFFFF !important;
  color: #FFFFFF !important;
  backdrop-filter: none !important;
}

.cft-home-btn-ghost:hover {
  background: #F787A8 !important;
  border-color: #F787A8 !important;
  color: #FFFFFF !important;
}

.cft-home-section-head h2,
.cft-home-path h3,
.cft-home-feature h3,
.cft-home-coverage-copy h2,
.cft-home-trust-inner h2 {
  color: #077B86 !important;
}

.cft-home-section-head p,
.cft-home-path p,
.cft-home-feature p,
.cft-home-coverage-copy p,
.cft-home-trust-inner > p,
.cft-home-lead {
  color: #424242 !important;
}

.cft-home-hero .cft-home-lead {
  color: rgba(255, 255, 255, 0.92) !important;
}

.cft-home-path {
  background: #FFFFFF !important;
  border: 1px solid #E0E0E0 !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06) !important;
  color: #424242 !important;
}

.cft-home-path::before {
  background: #077B86 !important;
}

.cft-home-path-cerer::before {
  background: #FF4C8F !important;
}

.cft-home-path-dipfa::before {
  background: linear-gradient(90deg, #077B86, #FF4C8F) !important;
}

.cft-home-path:hover {
  border-color: #077B86 !important;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.1) !important;
}

.cft-home-path-tag {
  background: #F0F7F8 !important;
  border-color: #077B86 !important;
  color: #077B86 !important;
}

.cft-home-path-cerer .cft-home-path-tag {
  background: rgba(255, 76, 143, 0.1) !important;
  border-color: #FF4C8F !important;
  color: #FF4C8F !important;
}

.cft-home-path-cta {
  color: #FF4C8F !important;
}

.cft-home-feature {
  background: #FFFFFF !important;
  border: 1px solid #E0E0E0 !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.05) !important;
}

.cft-home-feature:nth-child(even) {
  background: #F0F7F8 !important;
}

.cft-home-feature-icon {
  background: #F0F7F8 !important;
  border-color: #077B86 !important;
  color: #077B86 !important;
}

.cft-home-coverage-panel {
  background: #F0F7F8 !important;
  border: 1px solid #E0E0E0 !important;
  box-shadow: none !important;
}

.cft-home-coverage-list li {
  background: #FFFFFF !important;
  border-color: #E0E0E0 !important;
  border-left-color: #077B86 !important;
  color: #424242 !important;
}

.cft-home-coverage-list strong {
  color: #077B86 !important;
}

.cft-home-trust-inner {
  background: #F0F7F8 !important;
  border: 1px solid #E0E0E0 !important;
  box-shadow: none !important;
}

.cft-home-trust-eyebrow {
  color: #FF4C8F !important;
}

.cft-home-trust-inner .cft-home-btn-ghost {
  border-color: #077B86 !important;
  color: #077B86 !important;
}

.cft-home-trust-inner .cft-home-btn-ghost:hover {
  background: #FF4C8F !important;
  border-color: #FF4C8F !important;
  color: #FFFFFF !important;
}

/* —— Content / FAQ / contact panels —— */
/* Page heroes = clarityft image banners (centered white title) */
html body .cft-content-hero.cft-page-hero,
html body .cft-page-hero,
html body .cft-calc-page-hero.cft-page-hero {
  background-color: #0a5560 !important;
  background-image: var(--cft-page-hero-image) !important;
  background-size: cover !important;
  background-position: center 30% !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Lighter mid overlay on About (same hero as clarityft.co.uk) */
html body.page-id-2 .cft-page-hero::before {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.34), rgba(0, 0, 0, 0.18)) !important;
}

.cft-auth-hero:not(.cft-page-hero) {
  background: #F0F7F8 !important;
  border: 1px solid #E0E0E0 !important;
  box-shadow: none !important;
}

html body .cft-content-hero.cft-page-hero h1,
html body .cft-page-hero-title,
html body .cft-calc-page-hero.cft-page-hero h1,
html body .cft-calc-page-hero.cft-page-hero h2 {
  color: #FFFFFF !important;
  text-transform: uppercase !important;
  font-weight: 800 !important;
}

.cft-content-hero-lead,
.cft-calc-page-hero p:not(.cft-page-hero-title),
.cft-content-badge,
.cft-calc-badge {
  color: #424242 !important;
}

.cft-content-badge,
.cft-calc-badge {
  background: #FFFFFF !important;
  border-color: #077B86 !important;
  color: #077B86 !important;
}

.cft-content-panel,
.cft-calc-page .tabcontent,
body.cft-is-calculator .tabcontent {
  background: #FFFFFF !important;
  border: 1px solid #E0E0E0 !important;
  color: #424242 !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.04) !important;
}

body.cft-is-calculator,
body.cft-is-calculator .entry-content,
body.cft-is-calculator .entry-content p,
body.cft-is-calculator label,
body.cft-is-content .entry-content p {
  color: #424242 !important;
}

body.cft-is-calculator h1,
body.cft-is-calculator h2,
body.cft-is-calculator h3,
body.cft-is-calculator h4 {
  color: #077B86 !important;
  font-family: "Nunito Sans", sans-serif !important;
}

body.cft-is-calculator .myBtn a,
body.cft-is-calculator .myBtnActive a,
.cft-calc-page .myBtn a,
.cft-calc-page .myBtnActive a {
  background: #077B86 !important;
  color: #FFFFFF !important;
}

body.cft-is-calculator .myBtnActive a,
.cft-calc-page .myBtnActive a {
  background: #FF4C8F !important;
}

body.cft-is-calculator input[type="button"],
body.cft-is-calculator input[type="submit"],
body.cft-is-calculator input[type="reset"],
body.cft-is-calculator button:not(.cft-nav-toggle),
.cft-calc-page input[type="button"],
.cft-calc-page button:not(.cft-nav-toggle) {
  background: #FF4C8F !important;
  border-color: #FF4C8F !important;
  color: #FFFFFF !important;
}

/* —— Accreditation strip + footer (match clarityft) —— */
.accreditation-strip,
.cft-accreditations {
  background: #077B86 !important;
  background-image: none !important;
  box-shadow: none !important;
}

.accreditation-strip__label,
.cft-accreditations-label {
  font-family: "Nunito Sans", sans-serif !important;
  font-weight: 700 !important;
  color: #FFFFFF !important;
  text-shadow: none !important;
  letter-spacing: 0.04em !important;
}

#footer,
#footer.cft-footer {
  background: #F0F7F8 !important;
  color: #424242 !important;
  font-family: "Nunito Sans", sans-serif !important;
  border-top: 0 !important;
}

#footer.cft-footer .cft-footer-nav a,
#footer.cft-footer .cft-footer-contact h3 {
  color: #000000 !important;
  font-family: "Nunito Sans", sans-serif !important;
}

#footer.cft-footer .cft-footer-about p,
#footer.cft-footer .cft-footer-contact p,
#footer.cft-footer .cft-footer-contact div,
#footer.cft-footer .cft-footer-rating-label {
  color: #424242 !important;
  font-family: "Nunito Sans", sans-serif !important;
}

#footer.cft-footer a:hover {
  color: #FF4C8F !important;
}

#footer.cft-footer .copy,
#footer.cft-footer .copy a {
  color: #8a8a8a !important;
}

#footer.cft-footer .f-bottom {
  border-top: 1px solid #d7e4e6 !important;
  background: #F0F7F8 !important;
}

html body #footer.cft-footer .cft-social a {
  background: transparent !important;
  border: 0 !important;
  width: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  color: #2A2A2A !important;
}

html body #footer.cft-footer .cft-social a svg path {
  fill: currentColor;
}

html body #footer.cft-footer .cft-social a:hover {
  color: #FF4C8F !important;
}

#footer.cft-footer .cft-stars-gold {
  color: #F4B400 !important;
}

#footer.cft-footer .cft-stars-freeindex {
  color: #2E8B3A !important;
}

.cft-social a:hover {
  background: transparent !important;
  transform: none !important;
}

.cft-social a:hover img {
  filter: none;
  /* approximate pink */
  filter: invert(42%) sepia(84%) saturate(2476%) hue-rotate(314deg) brightness(101%) contrast(101%);
}

.cft-contact-icon {
  color: #077B86 !important;
}

/* Links / accents */
a {
  color: #FF4C8F;
}

a:hover {
  color: #077B86;
}

/* UM / forms on light pages */
body.um-page,
body.cft-is-auth {
  background: #FFFFFF !important;
}

.um .um-field-label,
.um .um-field-label label {
  color: #424242 !important;
}