/* Workefy contrast — light text on dark surfaces, dark text on light surfaces */

/* ─── Dark section backgrounds ─── */
.section.hero-v1,
.section.process,
.section.footer,
.section.inner,
.section.team,
.section.branch {
  color: rgba(255, 255, 255, 0.92);
}

.section.footer {
  background-color: #252860 !important;
  background-image:
    radial-gradient(ellipse 50% 60% at 0% 100%, rgba(91, 163, 232, 0.12), transparent 55%),
    radial-gradient(ellipse 40% 50% at 100% 0%, rgba(13, 148, 136, 0.1), transparent 50%) !important;
}

.section.process {
  background-color: #252860 !important;
  background-image:
    radial-gradient(ellipse 60% 50% at 15% 20%, rgba(91, 163, 232, 0.2), transparent 55%),
    radial-gradient(ellipse 45% 40% at 90% 80%, rgba(13, 148, 136, 0.14), transparent 50%),
    linear-gradient(165deg, #1a1d45 0%, #252860 55%, #2a316e 100%) !important;
}

.section.inner {
  background-color: #252860 !important;
  background-image:
    radial-gradient(ellipse 65% 55% at 10% 15%, rgba(91, 163, 232, 0.22), transparent 55%),
    radial-gradient(ellipse 40% 40% at 95% 85%, rgba(242, 169, 59, 0.12), transparent 50%),
    linear-gradient(165deg, #1a1d45 0%, #252860 60%, #2a316e 100%) !important;
}

/* Hero */
.section.hero-v1 .hero-v1-title {
  color: #ffffff !important;
}

.section.hero-v1 .hero-v1-details {
  color: rgba(255, 255, 255, 0.82) !important;
}

/* Inner page heroes (Features, Pricing, Contact, etc.) */
.section.inner .inner-title,
.section.inner .inner-title.contact,
.section.inner .inner-title.pricing,
.section.inner .inner-title.features,
.section.inner .inner-title.career,
.section.inner .inner-title.price {
  color: #ffffff !important;
}

.section.inner .inner-details,
.section.inner .inner-details.career,
.section.inner .inner-details.blog {
  color: rgba(255, 255, 255, 0.82) !important;
}

/* Process band */
.section.process .section-title.white {
  color: #ffffff !important;
}

.section.process .section-details.light {
  color: rgba(255, 255, 255, 0.82) !important;
}

.section.process .process-item-title {
  color: #ffffff !important;
}

.section.process .process-item-detais {
  color: rgba(255, 255, 255, 0.88) !important;
}

/* Team (About) */
.section.team .section-title.white {
  color: #ffffff !important;
}

.section.team .section-details.light {
  color: rgba(255, 255, 255, 0.82) !important;
}

.section.team .team-name {
  color: #ffffff !important;
}

.section.team .team-position {
  color: rgba(255, 255, 255, 0.78) !important;
}

/* Branch / dark gradient bands */
.section.branch .section-title,
.section.branch .section-details,
.section.branch .about-top-title,
.section.branch .about-top-details,
.section.branch .step-item-title,
.section.branch .step-item-details {
  color: #ffffff !important;
}

.section.branch .section-details,
.section.branch .about-top-details,
.section.branch .step-item-details {
  color: rgba(255, 255, 255, 0.82) !important;
}

/* Footer */
.section.footer .footer-details,
.section.footer .footer-nav-link,
.section.footer .copywrite-text {
  color: rgba(255, 255, 255, 0.78) !important;
}

.section.footer .footer-menu-title {
  color: #ffffff !important;
}

.section.footer .footer-nav-link:hover {
  color: #5ba3e8 !important;
}

.section.footer .copyright-text-wrap {
  border-top-color: rgba(255, 255, 255, 0.14) !important;
}

/* Auth / user split layout (dark panel) */
.section.user .user-left-wrap .user-form-title,
.section.user .user-left-wrap .user-label,
.section.user .user-left-wrap .user-another-link {
  color: rgba(255, 255, 255, 0.92) !important;
}

.section.user .user-left-wrap .user-link {
  color: #5ba3e8 !important;
}

.section.user .user-left-wrap .user-link:hover {
  color: #ffffff !important;
}

/* Light blue band on auth right column */
.user-content-wrap .user-title,
.user-content-wrap .user-details {
  color: #252860 !important;
}

/* Button colors/labels: workefy-buttons.css (surface-aware tokens).
   Do not re-add per-section button fills here. */

/* CTA band — blue → teal depth with amber spark (not flat single blue) */
.cta-wrapper {
  background-color: #5ba3e8 !important;
  background-image:
    radial-gradient(ellipse 55% 70% at 0% 50%, rgba(13, 148, 136, 0.35), transparent 60%),
    radial-gradient(ellipse 40% 55% at 100% 0%, rgba(242, 169, 59, 0.28), transparent 55%),
    linear-gradient(135deg, #5ba3e8 0%, #458fd4 48%, #3a7fc4 100%) !important;
}

.cta-wrapper .cta-title,
.cta-wrapper .cta-details {
  color: #0b1f3a !important;
}

/* ─── Light content sections → dark headings ─── */
.section.our-journey .section-title,
.section.our-goals .section-title,
.section.blog .section-title,
.section.faq-v1 .section-title,
.section.faq-v1 .faq-question,
.section.application .section-title,
.section.about .section-title,
.section.about .about-content-title,
.section.about .about-item-title,
.section.about .about-top-title,
.section.features .section-title,
.section.pricing .section-title,
.section.contact .section-title,
.section.career .section-title,
.section.changelog .section-title,
.section.license .section-title,
.section.privacy .section-title,
.section.terms-inner .section-title {
  color: #252860 !important;
}

.section.our-journey .section-details,
.section.our-goals .section-details,
.section.blog .section-details,
.section.faq-v1 .section-details,
.section.faq-v1 .faq-answer,
.section.about .section-details,
.section.about .about-top-details,
.section.features .section-details,
.section.pricing .section-details,
.section.contact .section-details,
.section.career .section-details,
.section.changelog .changelog-top-details,
.section.privacy .privacy-item-details {
  color: #5f6368 !important;
}

.section.our-journey .journey-item-title,
.section.our-goals .goal-item-title,
.section.blog .blog-item-title,
.section.blog .blog-item-details,
.section.blog .blog-button,
.section.features .service-item-title,
.section.pricing .pricing-plan-title,
.section.pricing .pricing-plan-details {
  color: #252860 !important;
}

.section.our-journey .journey-item-details,
.section.our-goals .goal-item-details {
  color: #5f6368 !important;
}

/* FAQ left column on About */
.section.faq-v1 .faq-title {
  color: #252860 !important;
}

.section.faq-v1 .faq-details {
  color: #5f6368 !important;
}

/* Nav dropdown (dark panel) */
.dropdown-list-wrap .dropdown-link {
  color: rgba(255, 255, 255, 0.88) !important;
}

.dropdown-list-wrap .dropdown-link.w--current {
  color: #5ba3e8 !important;
}

.dropdown-list-wrap .dropdown-item-title {
  color: #ffffff !important;
  font-weight: 700 !important;
}

/* Form submit on light-blue (keep dark for WCAG on #5ba3e8) */
.user-form-submit {
  color: #252860 !important;
}

.user-form-submit:hover {
  color: #252860 !important;
}

/* ─── Button icon contrast (dual Webflow icon swap) ─── */
.primary-btn-icon[src*="btn-icon-dark"],
.primary-btn-icon[src*="button-icon"] {
  transition: opacity var(--workefy-hover-fast, 0.18s) ease,
    filter var(--workefy-hover-fast, 0.18s) ease;
}

/* Filled blue buttons on light surfaces → white icon */
.primary-btn-wrapper:not(.white):not(.pricing) .primary-btn-icon[src*="button-icon"] {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.primary-btn-wrapper:not(.white):not(.pricing)
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="btn-icon-dark"] {
  opacity: 0 !important;
  visibility: hidden !important;
}

.primary-btn-wrapper.cta .primary-btn-icon[src*="button-icon"] {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.primary-btn-wrapper.cta
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="btn-icon-dark"] {
  opacity: 0 !important;
  visibility: hidden !important;
}

/* White / pricing outline buttons → dark icon; white icon on hover fill */
.primary-btn-wrapper.white .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"]) .primary-btn-icon[src*="btn-icon-dark"],
.primary-btn-wrapper.pricing .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"]) .primary-btn-icon[src*="btn-icon-dark"] {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.primary-btn-wrapper.white .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"]) .primary-btn-icon[src*="button-icon"],
.primary-btn-wrapper.pricing .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"]) .primary-btn-icon[src*="button-icon"] {
  opacity: 0 !important;
  visibility: hidden !important;
}

.primary-btn-wrapper.white
  .primary-btn-icons:not(:has(.primary-btn-icon[src*="btn-icon-dark"]))
  .primary-btn-icon[src*="button-icon"]:first-child,
.primary-btn-wrapper.pricing
  .primary-btn-icons:not(:has(.primary-btn-icon[src*="btn-icon-dark"]))
  .primary-btn-icon[src*="button-icon"]:first-child {
  opacity: 1 !important;
  visibility: visible !important;
  filter: brightness(0) saturate(100%) !important;
}

.primary-btn-wrapper.white
  .primary-btn-icons:not(:has(.primary-btn-icon[src*="btn-icon-dark"]))
  .primary-btn-icon[src*="button-icon"]:not(:first-child),
.primary-btn-wrapper.pricing
  .primary-btn-icons:not(:has(.primary-btn-icon[src*="btn-icon-dark"]))
  .primary-btn-icon[src*="button-icon"]:not(:first-child) {
  opacity: 0 !important;
  visibility: hidden !important;
}

.primary-btn-wrapper.white:hover .primary-btn-icon[src*="button-icon"],
.primary-btn-wrapper.pricing:hover .primary-btn-icon[src*="button-icon"] {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.primary-btn-wrapper.white:hover
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="btn-icon-dark"],
.primary-btn-wrapper.pricing:hover
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="btn-icon-dark"] {
  opacity: 0 !important;
  visibility: hidden !important;
}

/* Hero outline on dark band */
.section.hero-v1 .primary-btn-wrapper.hero .primary-btn-icon[src*="button-icon"] {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.section.hero-v1 .primary-btn-wrapper.hero
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="btn-icon-dark"] {
  opacity: 0 !important;
  visibility: hidden !important;
}

.section.hero-v1 .primary-btn-wrapper.hero:hover
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="btn-icon-dark"] {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.section.hero-v1 .primary-btn-wrapper.hero:hover
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="button-icon"] {
  opacity: 0 !important;
  visibility: hidden !important;
}

.section.hero-v1 .primary-btn-wrapper.hero:hover
  .primary-btn-icons:not(:has(.primary-btn-icon[src*="btn-icon-dark"]))
  .primary-btn-icon[src*="button-icon"]:first-child {
  filter: brightness(0) saturate(100%) !important;
}

/* White filled buttons on dark sections → dark icon (incl. hover) */
:is(
    .section.hero-v1,
    .section.inner,
    .section.process,
    .section.branch,
    .section.team,
    .section.footer,
    .section.blog-inner,
    .wf-bg-navy
  )
  .primary-btn-wrapper:not(.hero):not(.white)
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="btn-icon-dark"],
:is(
    .section.hero-v1,
    .section.inner,
    .section.process,
    .section.branch,
    .section.team,
    .section.footer,
    .section.blog-inner,
    .wf-bg-navy
  )
  .primary-btn-wrapper:not(.hero):not(.white):hover
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="btn-icon-dark"] {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

:is(
    .section.hero-v1,
    .section.inner,
    .section.process,
    .section.branch,
    .section.team,
    .section.footer,
    .section.blog-inner,
    .wf-bg-navy
  )
  .primary-btn-wrapper:not(.hero):not(.white)
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="button-icon"],
:is(
    .section.hero-v1,
    .section.inner,
    .section.process,
    .section.branch,
    .section.team,
    .section.footer,
    .section.blog-inner,
    .wf-bg-navy
  )
  .primary-btn-wrapper:not(.hero):not(.white):hover
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="button-icon"] {
  opacity: 0 !important;
  visibility: hidden !important;
}

:is(
    .section.hero-v1,
    .section.inner,
    .section.process,
    .section.branch,
    .section.team,
    .section.footer,
    .section.blog-inner,
    .wf-bg-navy
  )
  .primary-btn-wrapper:not(.hero):not(.white)
  .primary-btn-icons:not(:has(.primary-btn-icon[src*="btn-icon-dark"]))
  .primary-btn-icon[src*="button-icon"]:first-child,
:is(
    .section.hero-v1,
    .section.inner,
    .section.process,
    .section.branch,
    .section.team,
    .section.footer,
    .section.blog-inner,
    .wf-bg-navy
  )
  .primary-btn-wrapper:not(.hero):not(.white):hover
  .primary-btn-icons:not(:has(.primary-btn-icon[src*="btn-icon-dark"]))
  .primary-btn-icon[src*="button-icon"]:first-child {
  opacity: 1 !important;
  visibility: visible !important;
  filter: brightness(0) saturate(100%) !important;
}

:is(
    .section.hero-v1,
    .section.inner,
    .section.process,
    .section.branch,
    .section.team,
    .section.footer,
    .section.blog-inner,
    .wf-bg-navy
  )
  .primary-btn-wrapper:not(.hero):not(.white)
  .primary-btn-icons:not(:has(.primary-btn-icon[src*="btn-icon-dark"]))
  .primary-btn-icon[src*="button-icon"]:not(:first-child),
:is(
    .section.hero-v1,
    .section.inner,
    .section.process,
    .section.branch,
    .section.team,
    .section.footer,
    .section.blog-inner,
    .wf-bg-navy
  )
  .primary-btn-wrapper:not(.hero):not(.white):hover
  .primary-btn-icons:not(:has(.primary-btn-icon[src*="btn-icon-dark"]))
  .primary-btn-icon[src*="button-icon"]:not(:first-child) {
  opacity: 0 !important;
  visibility: hidden !important;
}

/* Career button hover (light fill) */
.primary-btn-wrapper.career:hover
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="btn-icon-dark"] {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.primary-btn-wrapper.career:hover
  .primary-btn-icons:has(.primary-btn-icon[src*="btn-icon-dark"])
  .primary-btn-icon[src*="button-icon"] {
  opacity: 0 !important;
  visibility: hidden !important;
}

.primary-btn-wrapper.career:hover
  .primary-btn-icons:not(:has(.primary-btn-icon[src*="btn-icon-dark"]))
  .primary-btn-icon[src*="button-icon"]:first-child {
  filter: brightness(0) saturate(100%) !important;
}