/*
 * coefex.com — Brand Alignment Foundation
 * Build 06.0 — 2026-07-15
 *
 * Purpose:
 * - consolidate the visual language across all custom coefex/YOOtheme elements;
 * - replace DevStack's bright green/blue-grey look with the coefex brand;
 * - standardise buttons, cards, borders, backgrounds, typography and gutters;
 * - leave the existing Builder structures and editable content intact.
 */

/* --------------------------------------------------------------------------
   1. Brand tokens
   -------------------------------------------------------------------------- */

:root {
    --cfx-forest-950: #09271e;
    --cfx-forest-900: #10382b;
    --cfx-forest-800: #15513d;
    --cfx-forest-700: #216c51;
    --cfx-forest-600: #2f7a5c;

    --cfx-logo-green: #009840;
    --cfx-logo-red: #b00008;

    --cfx-ink: #17211d;
    --cfx-text: #34443d;
    --cfx-muted: #64736c;
    --cfx-subtle: #84918b;

    --cfx-mint-100: #e8f4ee;
    --cfx-mint-50: #f4faf7;
    --cfx-warm-50: #fbf5ee;
    --cfx-surface: #ffffff;
    --cfx-surface-alt: #f3f7f5;
    --cfx-border: #d8e3dd;
    --cfx-border-strong: #bfd2c8;

    --cfx-container: 1240px;
    --cfx-reading: 780px;
    --cfx-gutter: clamp(22px, 4vw, 64px);
    --cfx-section-space: clamp(72px, 7.5vw, 112px);

    --cfx-radius-sm: 7px;
    --cfx-radius: 11px;
    --cfx-radius-lg: 16px;

    --cfx-shadow-sm: 0 8px 24px rgba(9, 39, 30, .055);
    --cfx-shadow-md: 0 18px 48px rgba(9, 39, 30, .075);
    --cfx-shadow-lg: 0 28px 70px rgba(9, 39, 30, .11);

    /* Backward-compatible variables used by the first hero build. */
    --cfx-green: var(--cfx-forest-600);
    --cfx-green-dark: var(--cfx-forest-800);
    --cfx-green-deep: var(--cfx-forest-950);
    --cfx-mint: var(--cfx-mint-100);
    --cfx-red: var(--cfx-logo-red);
}

html {
    color-scheme: light;
    scroll-behavior: smooth;
}

body {
    color: var(--cfx-text);
    background: var(--cfx-surface);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body,
input,
select,
textarea,
button {
    font-synthesis: none;
}

::selection {
    color: #fff;
    background: var(--cfx-forest-700);
}

/* --------------------------------------------------------------------------
   2. YOOtheme / UIkit global brand layer
   -------------------------------------------------------------------------- */

html body a {
    color: var(--cfx-forest-700);
    text-underline-offset: .18em;
}

html body a:hover,
html body a:focus {
    color: var(--cfx-forest-900);
}

html body :is(h1, h2, h3, h4, h5, h6),
html body .uk-heading-small,
html body .uk-heading-medium,
html body .uk-heading-large,
html body .uk-heading-xlarge,
html body .uk-heading-2xlarge {
    color: var(--cfx-ink);
    text-wrap: balance;
}

html body .uk-text-lead {
    color: var(--cfx-text);
}

html body .uk-text-muted {
    color: var(--cfx-muted) !important;
}

html body .uk-link-text,
html body a.uk-link-text {
    color: var(--cfx-forest-700) !important;
}

html body .uk-button {
    border-radius: 999px;
    font-weight: 750;
    letter-spacing: 0;
    text-transform: none;
    transition:
        color .18s ease,
        background-color .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease;
}

html body .uk-button:hover {
    transform: translateY(-1px);
}

html body .uk-button-primary,
html body .uk-button-secondary,
html body .uk-button-danger {
    border-color: var(--cfx-forest-800) !important;
    background: var(--cfx-forest-800) !important;
    color: #fff !important;
    box-shadow: 0 9px 24px rgba(21, 81, 61, .16);
}

html body :is(.uk-button-primary, .uk-button-secondary, .uk-button-danger):hover,
html body :is(.uk-button-primary, .uk-button-secondary, .uk-button-danger):focus {
    border-color: var(--cfx-forest-950) !important;
    background: var(--cfx-forest-950) !important;
    color: #fff !important;
    box-shadow: 0 12px 30px rgba(9, 39, 30, .2);
}

html body .uk-button-default {
    border-color: var(--cfx-border-strong) !important;
    background: #fff !important;
    color: var(--cfx-forest-800) !important;
}

html body .uk-button-default:hover,
html body .uk-button-default:focus {
    border-color: var(--cfx-forest-700) !important;
    background: var(--cfx-mint-50) !important;
    color: var(--cfx-forest-950) !important;
}

html body :is(.uk-label, .uk-badge) {
    border: 1px solid rgba(33, 108, 81, .14);
    border-radius: 999px;
    background: var(--cfx-mint-100);
    color: var(--cfx-forest-800);
    font-weight: 750;
}

html body .uk-card-default {
    border: 1px solid var(--cfx-border);
    border-radius: var(--cfx-radius);
    background: var(--cfx-surface);
    box-shadow: var(--cfx-shadow-sm);
}

html body .uk-card-hover:hover {
    box-shadow: var(--cfx-shadow-md);
}

html body .uk-input,
html body .uk-select,
html body .uk-textarea {
    border-color: var(--cfx-border-strong);
    border-radius: var(--cfx-radius-sm);
    background: #fff;
    color: var(--cfx-ink);
}

html body :is(.uk-input, .uk-select, .uk-textarea):focus {
    border-color: var(--cfx-forest-600);
    box-shadow: 0 0 0 3px rgba(47, 122, 92, .11);
}

html body .uk-checkbox:checked,
html body .uk-checkbox:indeterminate,
html body .uk-radio:checked {
    border-color: var(--cfx-forest-700);
    background-color: var(--cfx-forest-700);
}

html body .uk-subnav-pill > .uk-active > a,
html body .uk-pagination > .uk-active > * {
    background: var(--cfx-forest-800);
    color: #fff;
}

/* --------------------------------------------------------------------------
   3. Global header / navigation
   -------------------------------------------------------------------------- */

html body .tm-header,
html body .tm-header-mobile,
html body .uk-navbar-container:not(.uk-navbar-transparent) {
    border-bottom: 1px solid rgba(21, 81, 61, .10);
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 4px 22px rgba(9, 39, 30, .035);
    backdrop-filter: blur(14px);
}

html body .tm-header .uk-navbar-nav > li > a,
html body .tm-header-mobile .uk-navbar-nav > li > a {
    min-height: 72px;
    color: var(--cfx-ink);
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -.005em;
    text-transform: none;
}

html body .tm-header .uk-navbar-nav > li:hover > a,
html body .tm-header .uk-navbar-nav > li > a:focus,
html body .tm-header .uk-navbar-nav > li.uk-active > a,
html body .tm-header-mobile .uk-navbar-nav > li.uk-active > a {
    color: var(--cfx-forest-700);
}

html body .tm-header .uk-navbar-nav > li.uk-active > a::after {
    right: 15px;
    bottom: 15px;
    left: 15px;
    height: 2px;
    border: 0;
    border-radius: 999px;
    background: var(--cfx-logo-green);
}

html body .tm-header :is(.uk-button-primary, .uk-button-secondary),
html body .tm-header-mobile :is(.uk-button-primary, .uk-button-secondary) {
    border-color: var(--cfx-forest-800) !important;
    background: var(--cfx-forest-800) !important;
    color: #fff !important;
    box-shadow: none;
}

html body .tm-header :is(.uk-button-primary, .uk-button-secondary):hover,
html body .tm-header-mobile :is(.uk-button-primary, .uk-button-secondary):hover {
    border-color: var(--cfx-forest-950) !important;
    background: var(--cfx-forest-950) !important;
}

html body .uk-navbar-toggle {
    color: var(--cfx-forest-900);
}

html body .uk-offcanvas-bar,
html body .uk-modal-dialog.uk-modal-body:has(.uk-nav) {
    background: var(--cfx-forest-950);
}

html body .uk-offcanvas-bar .uk-nav-default > li > a,
html body .uk-offcanvas-bar .uk-nav-primary > li > a {
    color: rgba(255, 255, 255, .84);
}

html body .uk-offcanvas-bar .uk-nav-default > li.uk-active > a,
html body .uk-offcanvas-bar .uk-nav-primary > li.uk-active > a,
html body .uk-offcanvas-bar a:hover {
    color: #fff;
}

/* --------------------------------------------------------------------------
   4. Shared custom-element token replacement
   -------------------------------------------------------------------------- */

html body :is(
    .cfx-audience,
    .cfx-problem,
    .cfx-workflows,
    .cfx-lab,
    .cfx-values,
    .cfx-steps,
    .cfx-pricing,
    .cfx-insights,
    .cfx-contact,
    .cfx-page-hero,
    .cfx-features,
    .cfx-feature-pilots,
    .cfx-value-outcomes,
    .cfx-value-stories,
    .cfx-value-audiences,
    .cfx-partner-paths,
    .cfx-partner-benefits,
    .cfx-partner-steps
) {
    --g: var(--cfx-forest-600) !important;
    --gd: var(--cfx-forest-800) !important;
    --ink: var(--cfx-ink) !important;
    --muted: var(--cfx-muted) !important;
    --line: var(--cfx-border) !important;
}

html body .cfx-home-hero,
html body .cfx-audience {
    --cfx-green: var(--cfx-forest-600) !important;
    --cfx-green-dark: var(--cfx-forest-800) !important;
    --cfx-green-deep: var(--cfx-forest-950) !important;
    --cfx-mint: var(--cfx-mint-100) !important;
    --cfx-ink: var(--cfx-ink) !important;
    --cfx-muted: var(--cfx-muted) !important;
    --cfx-border: var(--cfx-border) !important;
}

/* Apply one consistent content width and gutter to all custom sections. */
html body :is(
    .cfx-home-hero__container,
    .cfx-audience__container,
    .cfx-problem__container,
    .cfx-workflows__container,
    .cfx-lab__container,
    .cfx-values__container,
    .cfx-steps__container,
    .cfx-pricing__container,
    .cfx-insights__container,
    .cfx-contact__container,
    .cfx-footer__container,
    .cfx-page-hero__container,
    .cfx-features__container,
    .cfx-feature-pilots__container,
    .cfx-value-outcomes__container,
    .cfx-value-stories__container,
    .cfx-value-audiences__container,
    .cfx-partner-paths__container,
    .cfx-partner-earning__container,
    .cfx-partner-benefits__container,
    .cfx-partner-steps__container
) {
    box-sizing: border-box !important;
    width: min(100%, var(--cfx-container)) !important;
    max-width: var(--cfx-container) !important;
    margin-inline: auto !important;
    padding-inline: var(--cfx-gutter) !important;
}

/* Standardise body copy without forcing all text to one size. */
html body :is(
    .cfx-audience__intro,
    .cfx-problem__intro,
    .cfx-workflows__intro,
    .cfx-lab__intro,
    .cfx-values__intro,
    .cfx-steps__intro,
    .cfx-pricing__intro,
    .cfx-insights__intro,
    .cfx-contact__intro,
    .cfx-page-hero__copy,
    .cfx-feature-pilots__intro,
    .cfx-value-outcomes__intro,
    .cfx-value-audiences__intro,
    .cfx-partner-paths__intro,
    .cfx-partner-benefits__intro,
    .cfx-partner-steps__intro,
    .cfx-partner-earning__copy
) {
    color: var(--cfx-muted) !important;
}

html body :is(
    .cfx-audience__eyebrow,
    .cfx-problem__eyebrow,
    .cfx-workflows__eyebrow,
    .cfx-lab__eyebrow,
    .cfx-values__eyebrow,
    .cfx-steps__eyebrow,
    .cfx-pricing__eyebrow,
    .cfx-insights__eyebrow,
    .cfx-contact__eyebrow,
    .cfx-page-hero__eyebrow,
    .cfx-feature-pilots__eyebrow,
    .cfx-value-outcomes__eyebrow,
    .cfx-value-audiences__eyebrow,
    .cfx-value-pilot__eyebrow,
    .cfx-partner-paths__eyebrow,
    .cfx-partner-earning__eyebrow,
    .cfx-partner-benefits__eyebrow,
    .cfx-partner-steps__eyebrow,
    .cfx-footer__eyebrow
) {
    color: var(--cfx-forest-700) !important;
    letter-spacing: .105em !important;
}

/* --------------------------------------------------------------------------
   5. Hero and page-hero refinements
   -------------------------------------------------------------------------- */

html body .cfx-home-hero {
    background: var(--cfx-forest-950) !important;
}

html body .cfx-home-hero__overlay {
    background:
        linear-gradient(90deg,
            rgba(9, 39, 30, .97) 0%,
            rgba(16, 56, 43, .90) 46%,
            rgba(21, 81, 61, .64) 100%),
        linear-gradient(180deg,
            rgba(9, 39, 30, .24) 0%,
            rgba(9, 39, 30, .42) 100%) !important;
}

html body .cfx-home-hero__video {
    opacity: .54 !important;
    filter: saturate(.82) contrast(1.08) !important;
}

html body .cfx-home-hero__title {
    max-width: 810px !important;
    font-weight: 520 !important;
    letter-spacing: -.035em !important;
}

html body .cfx-home-hero__copy {
    color: rgba(255, 255, 255, .84) !important;
}

html body .cfx-home-hero__trust {
    color: rgba(255, 255, 255, .68) !important;
}

html body .cfx-home-hero .cfx-eyebrow {
    color: #bce3cf !important;
}

html body .cfx-home-hero__proof {
    border-color: rgba(33, 108, 81, .22) !important;
    border-left-color: var(--cfx-logo-green) !important;
    border-radius: var(--cfx-radius) !important;
    background: rgba(255, 255, 255, .95) !important;
    box-shadow: var(--cfx-shadow-lg) !important;
}

html body .cfx-home-hero__proof strong {
    color: var(--cfx-forest-800) !important;
}

html body .cfx-proof-pill {
    border: 1px solid rgba(33, 108, 81, .12) !important;
    background: var(--cfx-mint-100) !important;
    color: var(--cfx-forest-800) !important;
}

html body .cfx-home-hero__art-card {
    border-color: rgba(255, 255, 255, .30) !important;
    border-radius: var(--cfx-radius) !important;
    box-shadow: 0 28px 72px rgba(0, 0, 0, .25) !important;
}

html body .cfx-home-hero .cfx-btn-primary {
    border-color: #fff !important;
    background: #fff !important;
    color: var(--cfx-forest-900) !important;
    box-shadow: none !important;
}

html body .cfx-home-hero .cfx-btn-primary:hover {
    border-color: var(--cfx-mint-100) !important;
    background: var(--cfx-mint-100) !important;
}

html body .cfx-page-hero {
    background:
        radial-gradient(circle at 8% 0%, rgba(0, 152, 64, .08), transparent 30%),
        linear-gradient(180deg, var(--cfx-mint-50), #fff) !important;
}

html body .cfx-page-hero h1 {
    color: var(--cfx-ink) !important;
    letter-spacing: -.04em !important;
}

html body .cfx-page-hero__primary,
html body .cfx-page-hero__actions a:first-child {
    border-color: var(--cfx-forest-800) !important;
    background: var(--cfx-forest-800) !important;
    color: #fff !important;
}

html body .cfx-page-hero__secondary,
html body .cfx-page-hero__actions a:not(:first-child) {
    border-color: var(--cfx-border-strong) !important;
    background: #fff !important;
    color: var(--cfx-forest-800) !important;
}

/* --------------------------------------------------------------------------
   6. Section backgrounds and rhythm
   -------------------------------------------------------------------------- */

html body :is(
    .cfx-audience,
    .cfx-workflows,
    .cfx-values,
    .cfx-pricing,
    .cfx-contact,
    .cfx-value-outcomes,
    .cfx-value-audiences,
    .cfx-partner-paths,
    .cfx-partner-benefits
) {
    background: var(--cfx-surface) !important;
}

html body :is(
    .cfx-problem,
    .cfx-steps,
    .cfx-insights,
    .cfx-features,
    .cfx-value-stories,
    .cfx-partner-steps
) {
    background: var(--cfx-surface-alt) !important;
}

html body :is(
    .cfx-lab,
    .cfx-feature-pilots,
    .cfx-value-pilot,
    .cfx-partner-earning
) {
    background: var(--cfx-mint-100) !important;
}

html body :is(
    .cfx-audience,
    .cfx-problem,
    .cfx-workflows,
    .cfx-lab,
    .cfx-values,
    .cfx-steps,
    .cfx-pricing,
    .cfx-insights,
    .cfx-contact,
    .cfx-features,
    .cfx-feature-pilots,
    .cfx-value-outcomes,
    .cfx-value-stories,
    .cfx-value-audiences,
    .cfx-partner-paths,
    .cfx-partner-earning,
    .cfx-partner-benefits,
    .cfx-partner-steps
) {
    border-color: var(--cfx-border) !important;
}

/* --------------------------------------------------------------------------
   7. Cards, panels and compact UI components
   -------------------------------------------------------------------------- */

html body :is(
    .cfx-audience-card,
    .cfx-problem__panel,
    .cfx-workflows__pane,
    .cfx-lab__card,
    .cfx-values__card,
    .cfx-steps__card,
    .cfx-pricing__modules,
    .cfx-pricing__option,
    .cfx-insights__card,
    .cfx-contact__form,
    .cfx-feature-item,
    .cfx-card-item,
    .cfx-value-story,
    .cfx-value-pilot__box,
    .cfx-partner-earning__panel
) {
    border-color: var(--cfx-border) !important;
    border-radius: var(--cfx-radius) !important;
    background: var(--cfx-surface) !important;
    box-shadow: var(--cfx-shadow-sm) !important;
}

html body :is(
    .cfx-audience-card,
    .cfx-values__card,
    .cfx-steps__card,
    .cfx-insights__card,
    .cfx-feature-item,
    .cfx-card-item,
    .cfx-value-story
) {
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

html body :is(
    .cfx-audience-card,
    .cfx-values__card,
    .cfx-steps__card,
    .cfx-insights__card,
    .cfx-feature-item,
    .cfx-card-item,
    .cfx-value-story
):hover {
    border-color: var(--cfx-border-strong) !important;
    box-shadow: var(--cfx-shadow-md) !important;
    transform: translateY(-2px);
}

html body :is(
    .cfx-audience-card__mark,
    .cfx-steps__number,
    .cfx-card-item__number
) {
    border-color: rgba(33, 108, 81, .14) !important;
    background: var(--cfx-mint-100) !important;
    color: var(--cfx-forest-800) !important;
}

html body :is(
    .cfx-workflows__chip,
    .cfx-lab__chip,
    .cfx-feature-item__chip,
    .cfx-value-story__chip,
    .cfx-insights__tag,
    .cfx-insights__card span,
    .cfx-pricing__label
) {
    border-color: rgba(33, 108, 81, .14) !important;
    background: var(--cfx-mint-100) !important;
    color: var(--cfx-forest-800) !important;
}

html body .cfx-workflows__tabs a,
html body .cfx-features__nav a,
html body .cfx-value-stories__nav a {
    color: var(--cfx-muted) !important;
}

html body .cfx-workflows__tabs .uk-active a,
html body .cfx-workflows__tabs a:hover,
html body .cfx-features__nav a:hover,
html body .cfx-value-stories__nav a:hover {
    color: var(--cfx-forest-800) !important;
}

html body .cfx-problem__panel {
    border-left-color: var(--cfx-logo-green) !important;
}

html body .cfx-contact__note {
    border-left-color: var(--cfx-logo-green) !important;
    background: var(--cfx-mint-100) !important;
}

html body .cfx-contact__form {
    background: #fff !important;
    box-shadow: var(--cfx-shadow-md) !important;
}

html body .cfx-contact__form :is(input, select, textarea) {
    border-color: var(--cfx-border-strong) !important;
    border-radius: var(--cfx-radius-sm) !important;
    color: var(--cfx-ink) !important;
}

html body .cfx-contact__form :is(input, select, textarea):focus {
    outline: 0;
    border-color: var(--cfx-forest-600) !important;
    box-shadow: 0 0 0 3px rgba(47, 122, 92, .11) !important;
}

/* --------------------------------------------------------------------------
   8. Pricing, newsletter and CTA treatments
   -------------------------------------------------------------------------- */

html body .cfx-pricing__option--featured {
    border-color: transparent !important;
    background:
        radial-gradient(circle at 90% 0%, rgba(0, 152, 64, .22), transparent 44%),
        linear-gradient(135deg, var(--cfx-forest-900), var(--cfx-forest-700)) !important;
    color: #fff !important;
    box-shadow: var(--cfx-shadow-md) !important;
}

html body .cfx-pricing__option--featured .cfx-pricing__label {
    border-color: rgba(255, 255, 255, .16) !important;
    background: rgba(255, 255, 255, .12) !important;
    color: #fff !important;
}

html body :is(
    .cfx-pricing__button,
    .cfx-contact__submit,
    .cfx-lab__button,
    .cfx-value-pilot a
) {
    border: 1px solid var(--cfx-forest-800) !important;
    background: var(--cfx-forest-800) !important;
    color: #fff !important;
    box-shadow: none !important;
}

html body :is(
    .cfx-pricing__button,
    .cfx-contact__submit,
    .cfx-lab__button,
    .cfx-value-pilot a
):hover,
html body :is(
    .cfx-pricing__button,
    .cfx-contact__submit,
    .cfx-lab__button,
    .cfx-value-pilot a
):focus {
    border-color: var(--cfx-forest-950) !important;
    background: var(--cfx-forest-950) !important;
    color: #fff !important;
}

html body .cfx-insights__newsletter {
    background:
        radial-gradient(circle at 92% 20%, rgba(0, 152, 64, .20), transparent 38%),
        linear-gradient(135deg, var(--cfx-forest-950), var(--cfx-forest-800)) !important;
    box-shadow: var(--cfx-shadow-md) !important;
}

html body .cfx-insights__newsletter :is(button, .cfx-insights__cta) {
    border: 1px solid #fff !important;
    background: #fff !important;
    color: var(--cfx-forest-900) !important;
}

/* --------------------------------------------------------------------------
   9. Value, feature and partnership page specifics
   -------------------------------------------------------------------------- */

html body .cfx-features__nav,
html body .cfx-value-stories__nav {
    border-color: var(--cfx-border) !important;
    border-radius: var(--cfx-radius) !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: var(--cfx-shadow-sm) !important;
}

html body .cfx-feature-item__image,
html body .cfx-value-story__image,
html body .cfx-audience-visual__box {
    border-color: var(--cfx-border) !important;
    border-radius: var(--cfx-radius) !important;
    background: var(--cfx-warm-50) !important;
}

html body .cfx-value-pilot {
    background: var(--cfx-mint-100) !important;
}

html body .cfx-value-pilot__box {
    border-color: var(--cfx-border-strong) !important;
}

html body .cfx-partner-earning {
    background: var(--cfx-mint-100) !important;
}

html body .cfx-partner-earning__panel {
    border-color: var(--cfx-border-strong) !important;
}

html body .cfx-partner-earning__row {
    border-color: var(--cfx-border) !important;
    color: var(--cfx-muted) !important;
}

html body .cfx-partner-earning__row strong {
    color: var(--cfx-forest-800) !important;
}

/* --------------------------------------------------------------------------
   10. Reimagined footer — branded, calmer, less fluorescent
   -------------------------------------------------------------------------- */

html body .uk-section:has(.cfx-footer) {
    background: var(--cfx-forest-950) !important;
}

html body .cfx-footer {
    --mint: #93d7b4 !important;
    --soft: #dcefe5 !important;
    --line: rgba(255, 255, 255, .12) !important;
    background:
        radial-gradient(circle at 86% 16%, rgba(0, 152, 64, .13), transparent 36%),
        var(--cfx-forest-950) !important;
}

html body .cfx-footer__cta {
    border-color: rgba(255, 255, 255, .13) !important;
    border-radius: var(--cfx-radius-lg) !important;
    background:
        linear-gradient(115deg,
            rgba(255, 255, 255, .075),
            rgba(255, 255, 255, .025)) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .16) !important;
}

html body .cfx-footer__eyebrow,
html body .cfx-footer__col h3 {
    color: #93d7b4 !important;
}

html body .cfx-footer__cta a {
    border: 1px solid #fff !important;
    background: #fff !important;
    color: var(--cfx-forest-900) !important;
    box-shadow: none !important;
}

html body .cfx-footer__cta a:hover,
html body .cfx-footer__cta a:focus {
    border-color: var(--cfx-mint-100) !important;
    background: var(--cfx-mint-100) !important;
}

html body .cfx-footer__col a,
html body .cfx-footer__social a {
    color: rgba(255, 255, 255, .70) !important;
}

html body .cfx-footer__col a:hover,
html body .cfx-footer__social a:hover {
    color: #fff !important;
}

html body .cfx-footer__social a:hover {
    border-color: rgba(147, 215, 180, .55) !important;
}

/* --------------------------------------------------------------------------
   11. Focus visibility and reduced motion
   -------------------------------------------------------------------------- */

html body :focus-visible {
    outline: 3px solid rgba(0, 152, 64, .34);
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* --------------------------------------------------------------------------
   12. Responsive brand refinements
   -------------------------------------------------------------------------- */

@media (max-width: 1199px) {
    :root {
        --cfx-container: 1120px;
    }
}

@media (max-width: 959px) {
    :root {
        --cfx-section-space: clamp(64px, 8vw, 88px);
    }

    html body .tm-header .uk-navbar-nav > li > a {
        min-height: 64px;
    }

    html body .cfx-home-hero__title {
        max-width: 760px !important;
    }
}

@media (max-width: 639px) {
    :root {
        --cfx-gutter: 20px;
        --cfx-radius: 10px;
        --cfx-radius-lg: 14px;
    }

    html body :is(
        .cfx-home-hero__container,
        .cfx-audience__container,
        .cfx-problem__container,
        .cfx-workflows__container,
        .cfx-lab__container,
        .cfx-values__container,
        .cfx-steps__container,
        .cfx-pricing__container,
        .cfx-insights__container,
        .cfx-contact__container,
        .cfx-footer__container,
        .cfx-page-hero__container,
        .cfx-features__container,
        .cfx-feature-pilots__container,
        .cfx-value-outcomes__container,
        .cfx-value-stories__container,
        .cfx-value-audiences__container,
        .cfx-partner-paths__container,
        .cfx-partner-earning__container,
        .cfx-partner-benefits__container,
        .cfx-partner-steps__container
    ) {
        padding-inline: var(--cfx-gutter) !important;
    }

    html body .cfx-home-hero__title {
        font-size: clamp(35px, 10vw, 43px) !important;
        letter-spacing: -.03em !important;
    }

    html body .cfx-page-hero h1 {
        font-size: clamp(38px, 11vw, 50px) !important;
    }

    html body :is(
        .cfx-contact__form,
        .cfx-feature-item,
        .cfx-value-story,
        .cfx-partner-earning__panel
    ) {
        padding: 22px !important;
    }

    html body .cfx-footer__cta {
        padding: 25px 22px !important;
    }
}

/* ================================================================
   BUILD 07 — INSIGHTS / JOOMLA CONTENT INTEGRATION
   ================================================================ */
:root {
    --cfx-insights-bg: #f4f8f6;
    --cfx-insights-card: #ffffff;
    --cfx-insights-line: #d9e4de;
}
.cfx-insights-hub,
.cfx-latest-insights,
.cfx-newsletter-band,
.cfx-related-insights {
    color: var(--cfx-ink);
}
.cfx-insights-hub a,
.cfx-latest-insights a,
.cfx-related-insights a { text-decoration: none; }
.cfx-insights-card__media img,
.cfx-insights-feature__media img { transition: transform .45s ease; }
.cfx-insights-card:hover .cfx-insights-card__media img,
.cfx-insights-feature:hover .cfx-insights-feature__media img { transform: scale(1.025); }
@media (prefers-reduced-motion: reduce) {
    .cfx-insights-card__media img,
    .cfx-insights-feature__media img { transition: none; }
}

/* ================================================================
   BUILD 07.1 — ACYMAILING NEWSLETTER FORM POLISH
   ================================================================ */

html body .cfx-newsletter-band__module {
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 14px;
    background: rgba(255, 255, 255, .045);
    padding: 22px 24px;
    box-shadow: none;
}

html body .cfx-newsletter-band__module .acym_module,
html body .cfx-newsletter-band__module .acym_fulldiv,
html body .cfx-newsletter-band__module form,
html body .cfx-newsletter-band__module .acym_module_form {
    width: 100%;
    margin: 0 !important;
}

html body .cfx-newsletter-band__module .acym_module_form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 12px;
}

html body .cfx-newsletter-band__module .onefield {
    min-width: 0;
    margin: 0 !important;
}

html body .cfx-newsletter-band__module label {
    display: block;
    margin: 0 !important;
    color: rgba(255, 255, 255, .82);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1.2;
    text-transform: uppercase;
}

html body .cfx-newsletter-band__module .acym__users__creation__fields__title {
    display: block;
    margin: 0 0 8px;
}

html body .cfx-newsletter-band__module input[type="email"],
html body .cfx-newsletter-band__module input[type="text"] {
    width: 100% !important;
    min-width: 0;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 1px solid rgba(255, 255, 255, .22) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, .97) !important;
    color: var(--cfx-ink) !important;
    font: inherit !important;
    box-shadow: none !important;
    outline: none !important;
}

html body .cfx-newsletter-band__module input[type="email"]:focus,
html body .cfx-newsletter-band__module input[type="text"]:focus {
    border-color: #9ed7ba !important;
    box-shadow: 0 0 0 3px rgba(158, 215, 186, .18) !important;
}

html body .cfx-newsletter-band__module .acysubbuttons {
    align-self: end;
    margin: 0 !important;
    padding: 0 !important;
}

html body .cfx-newsletter-band__module .acysubbuttons noscript {
    display: none;
}

html body .cfx-newsletter-band__module button[type="submit"],
html body .cfx-newsletter-band__module .btn-primary,
html body .cfx-newsletter-band__module .subbutton {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 132px;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 22px !important;
    border: 1px solid #fff !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: var(--cfx-forest-900) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}

html body .cfx-newsletter-band__module button[type="submit"]:hover,
html body .cfx-newsletter-band__module button[type="submit"]:focus,
html body .cfx-newsletter-band__module .btn-primary:hover,
html body .cfx-newsletter-band__module .btn-primary:focus,
html body .cfx-newsletter-band__module .subbutton:hover,
html body .cfx-newsletter-band__module .subbutton:focus {
    border-color: var(--cfx-mint-100) !important;
    background: var(--cfx-mint-100) !important;
    color: var(--cfx-forest-950) !important;
    transform: translateY(-1px);
}

html body .cfx-newsletter-band__module .acym__field__error__block {
    margin-top: 6px;
    color: #ffd6d6;
    font-size: 12px;
}

html body .cfx-newsletter-band__module .acym_message {
    margin-top: 12px;
    border-radius: 10px;
}

@media (max-width: 639px) {
    html body .cfx-newsletter-band__module {
        padding: 18px;
    }

    html body .cfx-newsletter-band__module .acym_module_form {
        grid-template-columns: 1fr;
    }

    html body .cfx-newsletter-band__module button[type="submit"],
    html body .cfx-newsletter-band__module .btn-primary,
    html body .cfx-newsletter-band__module .subbutton {
        width: 100%;
    }
}

/* ================================================================
   BUILD 08 — MOBILE HEADER, GLOBAL RESPONSIVE AND PRE-FOOTER POLISH
   ================================================================ */

html,
body {
    max-width: 100%;
    overflow-x: clip;
}

/* Mobile header */
html body .tm-header-mobile {
    position: relative;
    z-index: 1000;
}

html body .tm-header-mobile .uk-navbar {
    min-height: 74px;
    padding-inline: max(18px, env(safe-area-inset-left));
}

html body .tm-header-mobile .uk-logo img {
    width: auto;
    max-width: 172px;
    max-height: 54px;
}

html body .tm-header-mobile .uk-navbar-toggle {
    width: 46px;
    min-height: 46px;
    border: 1px solid rgba(21, 81, 61, .14);
    border-radius: 999px;
    background: #fff;
    color: var(--cfx-forest-950);
}

html body .tm-header-mobile .uk-navbar-toggle:hover,
html body .tm-header-mobile .uk-navbar-toggle:focus {
    border-color: rgba(21, 81, 61, .30);
    background: var(--cfx-mint-50);
}

/* YOOtheme mobile dialog / offcanvas */
html body .uk-offcanvas-bar {
    width: min(88vw, 390px);
    padding: 34px 28px 30px;
    background:
        radial-gradient(circle at 100% 0, rgba(255,255,255,.08), transparent 34%),
        var(--cfx-forest-950);
}

html body .uk-offcanvas-bar .uk-close {
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 999px;
    color: #fff;
}

html body .uk-offcanvas-bar .uk-nav {
    margin-top: 44px;
}

html body .uk-offcanvas-bar .uk-nav > li {
    border-bottom: 1px solid rgba(255,255,255,.10);
}

html body .uk-offcanvas-bar .uk-nav > li > a {
    display: flex;
    align-items: center;
    min-height: 58px;
    padding: 8px 0;
    color: rgba(255,255,255,.88) !important;
    font-size: 20px;
    font-weight: 680;
    letter-spacing: -.02em;
    text-transform: none;
}

html body .uk-offcanvas-bar .uk-nav > li.uk-active > a,
html body .uk-offcanvas-bar .uk-nav > li > a:hover,
html body .uk-offcanvas-bar .uk-nav > li > a:focus {
    color: #fff !important;
}

html body .uk-offcanvas-bar .uk-nav > li.uk-active > a::before {
    content: "";
    width: 8px;
    height: 8px;
    margin-right: 11px;
    border-radius: 999px;
    background: var(--cfx-logo-green);
}

html body .uk-offcanvas-bar :is(.uk-button-primary, .uk-button-secondary) {
    width: 100%;
    margin-top: 24px;
    border-color: #fff !important;
    background: #fff !important;
    color: var(--cfx-forest-950) !important;
}

/* Global responsive media and tables */
html body :is(.cfx-home-hero, .cfx-page-hero, .cfx-feature-item, .cfx-value-story) img {
    max-width: 100%;
    height: auto;
}

html body :is(.cfx-pricing, .cfx-features, .cfx-value-stories) table {
    min-width: 680px;
}

html body :is(.cfx-pricing, .cfx-features, .cfx-value-stories) .uk-overflow-auto {
    margin-inline: calc(var(--cfx-gutter) * -1);
    padding-inline: var(--cfx-gutter);
}

/* Newsletter as a global pre-footer */
html body .cfx-newsletter-band {
    padding-block: clamp(42px, 5vw, 72px);
}

html body .cfx-newsletter-band__inner {
    align-items: center;
}

html body .cfx-newsletter-band__module {
    min-width: 0;
}

html body .cfx-newsletter-band__module label {
    white-space: nowrap;
}

/* Contact-to-footer rhythm */
html body .cfx-contact {
    padding-top: clamp(68px, 7vw, 108px);
    padding-bottom: clamp(70px, 8vw, 118px);
}

html body .cfx-contact__form {
    box-shadow: 0 18px 50px rgba(9,39,30,.065);
}

html body .cfx-footer {
    padding-top: clamp(58px, 6vw, 88px);
}

/* Mobile: all marketing pages */
@media (max-width: 767px) {
    :root {
        --cfx-gutter: 18px;
        --cfx-section-space: 66px;
    }

    html body .tm-header-mobile .uk-navbar {
        min-height: 70px;
    }

    html body .tm-header-mobile .uk-logo img {
        max-width: 154px;
        max-height: 48px;
    }

    html body :is(
        .cfx-audience,
        .cfx-problem,
        .cfx-workflows,
        .cfx-lab,
        .cfx-values,
        .cfx-steps,
        .cfx-pricing,
        .cfx-insights,
        .cfx-contact,
        .cfx-page-hero,
        .cfx-features,
        .cfx-feature-pilots,
        .cfx-value-outcomes,
        .cfx-value-stories,
        .cfx-value-audiences,
        .cfx-partner-paths,
        .cfx-partner-earning,
        .cfx-partner-benefits,
        .cfx-partner-steps,
        .cfx-insights-hub,
        .cfx-latest-insights,
        .cfx-related-insights
    ) {
        scroll-margin-top: 78px;
    }

    html body :is(
        .cfx-page-hero h1,
        .cfx-insights-hub h1
    ) {
        max-width: 12ch;
        font-size: clamp(40px, 11vw, 55px) !important;
        line-height: .98 !important;
        letter-spacing: -.045em !important;
    }

    html body :is(
        .cfx-audience h2,
        .cfx-problem h2,
        .cfx-workflows h2,
        .cfx-lab h2,
        .cfx-values h2,
        .cfx-steps h2,
        .cfx-pricing h2,
        .cfx-insights h2,
        .cfx-contact h2,
        .cfx-newsletter-band h2
    ) {
        font-size: clamp(31px, 8.8vw, 42px) !important;
        line-height: 1.02 !important;
        letter-spacing: -.035em !important;
    }

    html body .cfx-home-hero {
        min-height: auto !important;
    }

    html body .cfx-home-hero__container {
        padding-top: 54px !important;
        padding-bottom: 56px !important;
    }

    html body .cfx-home-hero__title {
        max-width: 11ch !important;
        font-size: clamp(38px, 10.5vw, 48px) !important;
        line-height: .98 !important;
    }

    html body .cfx-home-hero__media {
        margin-top: 34px;
    }

    html body .cfx-home-hero__proof {
        padding: 18px !important;
    }

    html body .cfx-insights-feature {
        grid-template-columns: 1fr !important;
    }

    html body .cfx-insights-feature__media {
        min-height: 240px;
    }

    html body .cfx-insights-grid {
        grid-template-columns: 1fr !important;
    }

    html body .cfx-insights-card__overlay-title {
        font-size: 20px !important;
    }

    html body .cfx-newsletter-band {
        padding-block: 44px;
    }

    html body .cfx-newsletter-band__inner {
        gap: 26px !important;
    }

    html body .cfx-newsletter-band__copy {
        max-width: none;
    }

    html body .cfx-newsletter-band__copy p {
        margin-top: 12px;
        font-size: 16px;
        line-height: 1.5;
    }

    html body .cfx-newsletter-band__module {
        padding: 16px !important;
        border-radius: 12px;
    }

    html body .cfx-newsletter-band__module label {
        font-size: 11px;
    }

    html body .cfx-newsletter-band__module input[type="email"],
    html body .cfx-newsletter-band__module input[type="text"],
    html body .cfx-newsletter-band__module button[type="submit"],
    html body .cfx-newsletter-band__module .btn-primary,
    html body .cfx-newsletter-band__module .subbutton {
        height: 48px !important;
    }

    html body .cfx-newsletter-band__module button[type="submit"],
    html body .cfx-newsletter-band__module .btn-primary,
    html body .cfx-newsletter-band__module .subbutton {
        min-width: 0;
        box-shadow: none !important;
    }

    html body .cfx-contact {
        padding-top: 62px;
        padding-bottom: 70px;
    }

    html body .cfx-contact__container {
        gap: 32px !important;
    }

    html body .cfx-contact__intro {
        max-width: none !important;
    }

    html body .cfx-contact__form {
        padding: 20px !important;
        border-radius: 14px;
        box-shadow: 0 14px 38px rgba(9,39,30,.055);
    }

    html body .cfx-contact__form :is(input, select, textarea) {
        min-height: 48px;
        font-size: 16px;
    }

    html body .cfx-contact__form textarea {
        min-height: 130px;
    }

    html body .cfx-footer {
        padding-top: 52px;
    }

    html body .cfx-footer__cta {
        display: block !important;
        padding: 24px 20px !important;
    }

    html body .cfx-footer__cta h2 {
        max-width: 14ch;
        font-size: 30px !important;
        line-height: 1.02 !important;
    }

    html body .cfx-footer__cta a {
        width: 100%;
        margin-top: 20px;
    }

    html body .cfx-footer__grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 28px 22px !important;
    }

    html body .cfx-footer__brand {
        grid-column: 1 / -1;
    }

    html body .cfx-footer__bottom {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 14px !important;
    }
}

@media (max-width: 420px) {
    html body .tm-header-mobile .uk-logo img {
        max-width: 142px;
    }

    html body .cfx-footer__grid {
        grid-template-columns: 1fr !important;
    }

    html body .cfx-footer__brand {
        grid-column: auto;
    }
}

/* ================================================================
   BUILD 09.1 — HOME WORKFLOW TAB TEXT VISIBILITY
   ================================================================ */

html body .cfx-workflows__tabs button,
html body .cfx-workflows__tab,
html body [class*="cfx-workflows"] [role="tab"] {
    color: var(--cfx-forest-900, #10382b) !important;
    -webkit-text-fill-color: var(--cfx-forest-900, #10382b) !important;
    opacity: 1 !important;
}

html body .cfx-workflows__tabs button.is-active,
html body .cfx-workflows__tab.is-active,
html body [class*="cfx-workflows"] [role="tab"][aria-selected="true"] {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body .cfx-workflows__tabs button span,
html body .cfx-workflows__tab span,
html body [class*="cfx-workflows"] [role="tab"] span {
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;
}

/* ================================================================
   BUILD 09.4 — PRECISE YOOESSENTIALS CONTACT FORM RESTYLE
   Targets the actual YooEssentials markup by data-ye-form-field.
   ================================================================ */

html body .cfx-contact__module form[data-uk-ye-form] { margin: 0 !important; }

html body .cfx-contact__module [data-ye-form-field] > .uk-form-label,
html body .cfx-contact__module [data-ye-form-field] > legend.uk-form-label {
    display: block;
    margin: 0 0 8px !important;
    color: var(--cfx-ink, #17211d) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

html body .cfx-contact__module .uk-input,
html body .cfx-contact__module .uk-textarea,
html body .cfx-contact__module .uk-select {
    width: 100% !important;
    border: 1px solid #cfd9d4 !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: var(--cfx-ink, #17211d) !important;
    box-shadow: none !important;
}
html body .cfx-contact__module .uk-input,
html body .cfx-contact__module .uk-select { min-height: 46px !important; padding: 0 13px !important; }
html body .cfx-contact__module .uk-textarea { min-height: 132px !important; padding: 12px 13px !important; resize: vertical; }
html body .cfx-contact__module :is(.uk-input,.uk-textarea,.uk-select):focus {
    border-color: var(--cfx-forest-700, #216c51) !important;
    box-shadow: 0 0 0 3px rgba(33,108,81,.10) !important;
}

html body .cfx-contact__module fieldset[data-ye-form-field] { margin: 0 !important; padding: 0 !important; border: 0 !important; }
html body .cfx-contact__module [data-ye-form-field="organization_type"],
html body .cfx-contact__module [data-ye-form-field="interests"],
html body .cfx-contact__module [data-ye-form-field="features"] { padding-top: 4px !important; }
html body .cfx-contact__module [data-ye-form-field="interests"],
html body .cfx-contact__module [data-ye-form-field="features"] {
    padding-top: 22px !important;
    border-top: 1px solid #e5ece8 !important;
}

html body .cfx-contact__module [data-ye-form-field="organization_type"] .uk-form-controls > .uk-grid,
html body .cfx-contact__module [data-ye-form-field="interests"] .uk-form-controls > .uk-grid,
html body .cfx-contact__module [data-ye-form-field="features"] .uk-form-controls > .uk-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px 22px !important;
    margin: 0 !important;
}

html body .cfx-contact__module [data-ye-form-field="organization_type"] .uk-form-controls > .uk-grid > label,
html body .cfx-contact__module [data-ye-form-field="interests"] .uk-form-controls > .uk-grid > label,
html body .cfx-contact__module [data-ye-form-field="features"] .uk-form-controls > .uk-grid > label {
    display: flex !important;
    align-items: flex-start !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--cfx-ink, #17211d) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    cursor: pointer;
}
html body .cfx-contact__module [data-ye-form-field="organization_type"] .uk-form-controls > .uk-grid > label > div:first-child,
html body .cfx-contact__module [data-ye-form-field="interests"] .uk-form-controls > .uk-grid > label > div:first-child,
html body .cfx-contact__module [data-ye-form-field="features"] .uk-form-controls > .uk-grid > label > div:first-child { flex: 0 0 auto; }
html body .cfx-contact__module [data-ye-form-field="organization_type"] .uk-form-controls > .uk-grid > label > div:last-child,
html body .cfx-contact__module [data-ye-form-field="interests"] .uk-form-controls > .uk-grid > label > div:last-child,
html body .cfx-contact__module [data-ye-form-field="features"] .uk-form-controls > .uk-grid > label > div:last-child {
    min-width: 0;
    margin-left: 8px !important;
}
html body .cfx-contact__module [data-ye-form-field="organization_type"] p,
html body .cfx-contact__module [data-ye-form-field="interests"] p,
html body .cfx-contact__module [data-ye-form-field="features"] p {
    margin: 0 !important;
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
}

html body .cfx-contact__module .uk-checkbox {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: inline-grid !important;
    place-content: center;
    width: 17px !important;
    height: 17px !important;
    min-width: 17px !important;
    min-height: 17px !important;
    margin: 1px 0 0 !important;
    padding: 0 !important;
    border: 1.5px solid #9fb1a8 !important;
    border-radius: 3px !important;
    background: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
    cursor: pointer;
}
html body .cfx-contact__module .uk-checkbox::before {
    content: "";
    width: 9px;
    height: 9px;
    transform: scale(0);
    background: #fff;
    clip-path: polygon(14% 44%,0 59%,40% 100%,100% 16%,84% 0,39% 62%);
    transition: transform .12s ease;
}
html body .cfx-contact__module .uk-checkbox:checked {
    border-color: var(--cfx-forest-700, #216c51) !important;
    background: var(--cfx-forest-700, #216c51) !important;
}
html body .cfx-contact__module .uk-checkbox:checked::before { transform: scale(1); }
html body .cfx-contact__module .uk-checkbox:focus-visible {
    outline: 3px solid rgba(33,108,81,.16) !important;
    outline-offset: 2px;
}

html body .cfx-contact__module [data-ye-form-field="phone_enabled"] > legend { font-size: 0 !important; }
html body .cfx-contact__module [data-ye-form-field="phone_enabled"] > legend::after { font-size: 13px; }
html body .cfx-contact__module [data-ye-form-field="phone_enabled"] .uk-form-controls {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px 14px;
}
html body .cfx-contact__module [data-ye-form-field="phone_enabled"] .uk-form-controls > label {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    color: var(--cfx-ink, #17211d) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}
html body .cfx-contact__module [data-ye-form-field="phone_enabled"] .uk-form-controls > label > div:last-child { margin-left: 7px !important; }
html body .cfx-contact__module [data-ye-form-field-errors] { margin-top: 6px; font-size: 12px !important; }

html body .cfx-contact__module button[type="submit"] {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 20px !important;
    border: 1px solid var(--cfx-forest-800, #15513d) !important;
    border-radius: 999px !important;
    background: var(--cfx-forest-800, #15513d) !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}
html body .cfx-contact__module button[type="submit"]:hover,
html body .cfx-contact__module button[type="submit"]:focus {
    border-color: var(--cfx-forest-950, #09271e) !important;
    background: var(--cfx-forest-950, #09271e) !important;
    color: #fff !important;
}

@media (max-width: 767px) {
    html body .cfx-contact__module [data-ye-form-field="organization_type"] .uk-form-controls > .uk-grid,
    html body .cfx-contact__module [data-ye-form-field="interests"] .uk-form-controls > .uk-grid,
    html body .cfx-contact__module [data-ye-form-field="features"] .uk-form-controls > .uk-grid {
        grid-template-columns: 1fr !important;
        gap: 9px !important;
    }
    html body .cfx-contact__module [data-ye-form-field="organization_type"] .uk-form-controls > .uk-grid > label,
    html body .cfx-contact__module [data-ye-form-field="interests"] .uk-form-controls > .uk-grid > label,
    html body .cfx-contact__module [data-ye-form-field="features"] .uk-form-controls > .uk-grid > label {
        font-size: 14px !important;
    }
}

/* ================================================================
   BUILD 11 — STICKY GLOBAL HEADER + LONG-PAGE NAVIGATION
   ================================================================ */

/* Keep the main site navigation available on long pages. */
html body .tm-header,
html body .tm-header-mobile {
    position: sticky;
    top: 0;
    z-index: 1000;
}

html body .tm-header {
    background: rgba(255,255,255,.96);
    backdrop-filter: saturate(150%) blur(10px);
    -webkit-backdrop-filter: saturate(150%) blur(10px);
    transition: box-shadow .18s ease, background-color .18s ease;
}

html body.cfx-page-scrolled .tm-header,
html body.cfx-page-scrolled .tm-header-mobile {
    box-shadow: 0 8px 30px rgba(9,39,30,.08);
}

/* Prevent anchored section headings from hiding below the sticky header. */
html body .cfx-feature-item,
html body .cfx-value-story,
html body [id] {
    scroll-margin-top: 108px;
}

/* Shared long-page navigation states. */
html body .cfx-features__nav,
html body .cfx-value-stories__nav {
    max-height: calc(100vh - 124px);
    overflow: auto;
    overscroll-behavior: contain;
}

html body .cfx-features__nav a,
html body .cfx-value-stories__nav a {
    position: relative;
    padding: 7px 8px 7px 14px !important;
    border-radius: 7px;
    transition: color .15s ease, background-color .15s ease;
}

html body .cfx-features__nav a::before,
html body .cfx-value-stories__nav a::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 50%;
    width: 4px;
    height: 4px;
    border-radius: 999px;
    background: currentColor;
    opacity: .35;
    transform: translateY(-50%);
}

html body .cfx-features__nav a.is-active,
html body .cfx-value-stories__nav a.is-active {
    color: var(--cfx-forest-800, #15513d) !important;
    background: #edf5f1;
    font-weight: 800;
}

html body .cfx-features__nav a.is-active::before,
html body .cfx-value-stories__nav a.is-active::before {
    opacity: 1;
}

/* Compact sticky in-page selector for tablet and mobile. */
html body .cfx-page-toc-mobile {
    display: none;
    position: sticky;
    top: 68px;
    z-index: 60;
    margin: 0 0 22px;
    padding: 10px;
    border: 1px solid #d8e3dd;
    border-radius: 10px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 8px 24px rgba(9,39,30,.07);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

html body .cfx-page-toc-mobile label {
    display: block;
    margin: 0 0 5px;
    color: #52606d;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

html body .cfx-page-toc-mobile select {
    width: 100%;
    height: 42px;
    padding: 0 36px 0 11px;
    border: 1px solid #cbd8d1;
    border-radius: 8px;
    background-color: #fff;
    color: #17211d;
    font-size: 13px;
    font-weight: 700;
}

@media (max-width: 959px) {
    html body .cfx-features__nav,
    html body .cfx-value-stories__nav {
        display: none !important;
    }

    html body .cfx-page-toc-mobile {
        display: block;
    }
}

@media (max-width: 767px) {
    html body .cfx-page-toc-mobile {
        top: 58px;
    }

    html body .cfx-feature-item,
    html body .cfx-value-story,
    html body [id] {
        scroll-margin-top: 96px;
    }
}

/* ================================================================
   BUILD 11.1 — TOC STICKY RELIABILITY + MOBILE SELECT POLISH
   ================================================================ */

/* Sticky belongs on the grid column, not only the inner navigation.
   This avoids ancestor/layout differences between Features and Values. */
@media (min-width: 960px) {
    html body .cfx-features__grid > aside,
    html body .cfx-value-stories__grid > aside {
        position: sticky !important;
        top: 96px !important;
        align-self: flex-start !important;
        height: fit-content !important;
        z-index: 20;
    }

    html body .cfx-features__nav,
    html body .cfx-value-stories__nav {
        position: static !important;
        top: auto !important;
    }

    /* Desktop must never show the compact select. */
    html body .cfx-page-toc-mobile {
        display: none !important;
    }
}

/* More deliberate sidebar appearance. */
html body .cfx-features__nav,
html body .cfx-value-stories__nav {
    border: 1px solid var(--cfx-border, #d8e3dd) !important;
    border-radius: 12px !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow: 0 10px 30px rgba(9,39,30,.055) !important;
}

/* Compact selector: visible only below desktop breakpoint. */
html body .cfx-page-toc-mobile {
    display: none !important;
}

@media (max-width: 959px) {
    html body .cfx-page-toc-mobile {
        display: block !important;
        position: sticky !important;
        top: 78px !important;
        z-index: 80 !important;
        margin: 0 0 24px !important;
        padding: 12px 14px !important;
        border: 1px solid #cbdad2 !important;
        border-radius: 12px !important;
        background: rgba(255,255,255,.98) !important;
        box-shadow: 0 12px 32px rgba(9,39,30,.10) !important;
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }

    html body .cfx-page-toc-mobile label {
        display: block !important;
        margin: 0 0 7px !important;
        color: var(--cfx-forest-800, #15513d) !important;
        font-size: 11px !important;
        font-weight: 850 !important;
        line-height: 1.2 !important;
        letter-spacing: .08em !important;
        text-transform: uppercase !important;
    }

    html body .cfx-page-toc-mobile select {
        -webkit-appearance: none !important;
        appearance: none !important;
        display: block !important;
        width: 100% !important;
        height: 46px !important;
        margin: 0 !important;
        padding: 0 46px 0 14px !important;
        border: 1px solid #b9cec3 !important;
        border-radius: 9px !important;
        background-color: #f8fbf9 !important;
        background-image:
            linear-gradient(45deg, transparent 50%, #15513d 50%),
            linear-gradient(135deg, #15513d 50%, transparent 50%) !important;
        background-position:
            calc(100% - 19px) 19px,
            calc(100% - 13px) 19px !important;
        background-size: 6px 6px, 6px 6px !important;
        background-repeat: no-repeat !important;
        color: #17211d !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 46px !important;
        box-shadow: none !important;
        cursor: pointer;
    }

    html body .cfx-page-toc-mobile select:focus {
        border-color: var(--cfx-forest-700, #216c51) !important;
        outline: none !important;
        box-shadow: 0 0 0 3px rgba(33,108,81,.12) !important;
    }
}

@media (max-width: 767px) {
    html body .cfx-page-toc-mobile {
        top: 66px !important;
        padding: 10px 12px !important;
    }
}