:root {
	/* tokens now in the uBind Design Tokens plugin */
}

  .ubind-header-wrap {
    position: fixed;
    top: 18px;
    left: 0;
    right: 0;
    z-index: 99999;
    display: flex;
    justify-content: center;
    pointer-events: none;
    transition: transform .4s var(--ub-ease-out), opacity .3s;
    font-family: var(--ub-body);
  }

  .ubind-header-wrap.hidden {
    transform: translateY(-120%);
    opacity: 0;
  }

  /* UBW-248. The wrap is `position: fixed`, so once the hide-on-scroll script has moved it
     off-screen the browser has nothing it can scroll to bring a focused nav control back
     into view - focus lands on an invisible control and no focus ring appears anywhere on
     the page. Shift+Tab from the first in-flow control reaches the header without any
     scroll, which is why tabbing forward never exposes it: that path goes through the
     in-flow skip link first, and scrolling up to reach the skip link is exactly what clears
     `.hidden`. The script is free to keep the class on; this outranks it while focus is
     inside, and covers the mobile menu too because that lives inside the same wrap. */
  .ubind-header-wrap.hidden:focus-within {
    transform: none;
    opacity: 1;
  }

  .ubind-nav {
    pointer-events: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px 10px 22px;
    background: rgba(11, 17, 15, 0.6);
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 999px;
    box-shadow: 0 20px 60px -20px rgba(0, 0, 0, .4);
    transition: background .3s;
  }

  .ubind-nav.scrolled {
    background: rgba(5, 8, 7, .85);
  }

  .ubind-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #ffffff;
    font-weight: 600;
    font-size: 17px;
    letter-spacing: -0.02em;
    padding-right: 6px;
    text-decoration: none;
  }

  .ubind-logo svg {
    width: 30px;
    height: 30px;
    color: var(--ub-emerald-400);
    display: block;
  }

  .ubind-logo .u {
    color: var(--ub-emerald-400);
  }

  .ubind-nav-links {
    display: flex;
    align-items: center;
    gap: 2px;
    margin: 0 6px 0 18px;
  }

  .ubind-nav-link {
    color: rgba(255, 255, 255, .78);
    font-size: 14px;
    padding: 8px 14px;
    border-radius: 999px;
    transition: background .2s, color .2s;
    text-decoration: none;
  }

  .ubind-nav-link:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, .08);
  }

  /* ---- Solutions dropdown ---- */
  .ubind-dropdown {
    position: relative;
    display: flex;
    align-items: center;
  }

  .ubind-dd-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font: inherit;
    font-size: 14px;
    line-height: 1;
    border: 0;
    background: none;
    cursor: pointer;
  }

  .ubind-caret {
    transition: transform .25s var(--ub-ease-out);
  }

  .ubind-dropdown:hover .ubind-caret,
  .ubind-dropdown.open .ubind-caret {
    transform: rotate(180deg);
  }

  .ubind-dd-menu {
    position: absolute;
    top: calc(100% + 14px);
    left: 50%;
    transform: translateX(-50%) translateY(8px);
    min-width: 230px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: rgba(11, 17, 15, .92);
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 16px;
    box-shadow: 0 24px 60px -18px rgba(0, 0, 0, .6);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .22s var(--ub-ease-out), transform .22s var(--ub-ease-out), visibility .22s;
    z-index: 10;
  }

  /* invisible bridge so hover doesn't drop in the gap */
  .ubind-dd-menu::before {
    content: '';
    position: absolute;
    top: -16px;
    left: 0;
    right: 0;
    height: 16px;
  }

  .ubind-dropdown:hover .ubind-dd-menu,
  .ubind-dropdown:focus-within .ubind-dd-menu,
  .ubind-dropdown.open .ubind-dd-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }

  .ubind-dd-item {
    display: block;
    padding: 10px 14px;
    border-radius: 10px;
    color: rgba(255, 255, 255, .78);
    font-size: 14px;
    white-space: nowrap;
    text-decoration: none;
    transition: background .2s, color .2s;
  }

  .ubind-dd-item:hover {
    background: rgba(255, 255, 255, .08);
    color: #ffffff;
  }

  .ubind-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px 18px;
    border-radius: 999px;
    font-weight: 500;
    font-size: 14px;
    letter-spacing: -0.005em;
    transition: transform .25s var(--ub-ease-out), box-shadow .25s, background .2s;
    white-space: nowrap;
    position: relative;
    overflow: hidden;
    text-decoration: none;
  }

  .ubind-btn-primary {
    background: var(--ub-emerald-500);
    color: #ffffff;
    box-shadow:
      0 1px 0 rgba(255, 255, 255, .18) inset,
      0 10px 30px -8px rgba(31, 166, 122, .5);
  }

  .ubind-btn-primary:hover {
    background: var(--ub-emerald-600);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow:
      0 1px 0 rgba(255, 255, 255, .18) inset,
      0 18px 40px -10px rgba(31, 166, 122, .6);
  }

  .ubind-arrow {
    transition: transform .25s var(--ub-ease-out);
  }

  .ubind-btn:hover .ubind-arrow {
    transform: translateX(4px);
  }

  /* ---- Mobile hamburger + menu ---- */
  .ubind-hamburger {
    display: none;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    margin-left: 4px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 999px;
    background: rgba(255, 255, 255, .04) !important;
    cursor: pointer;
    flex-direction: column;
    gap: 5px;
  }

  .ubind-hamburger span {
    display: block;
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background: rgba(255, 255, 255, .9);
    transition: transform .28s var(--ub-ease-out), opacity .2s;
  }


  .ubind-hamburger.open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

  .ubind-hamburger.open span:nth-child(2) {
    opacity: 0;
  }

  .ubind-hamburger.open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .ubind-mobile-menu {
    position: absolute;
    top: calc(100% + 12px);
    left: 12px;
    right: 12px;
    pointer-events: auto;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: rgba(11, 17, 15, .95);
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 20px;
    box-shadow: 0 24px 60px -18px rgba(0, 0, 0, .6);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .24s var(--ub-ease-out), transform .24s var(--ub-ease-out), visibility .24s;
  }

  .ubind-mobile-menu.open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

  .ubind-m-link {
    display: block;
    padding: 12px 14px;
    border-radius: 12px;
    color: rgba(255, 255, 255, .82);
    font-size: 15px;
    text-decoration: none;
    transition: background .2s, color .2s;
  }

  .ubind-m-link:hover,
  .ubind-m-link:focus-visible {
    background: rgba(255, 255, 255, .08);
    color: #ffffff;
  }

  /* Mobile accordion for Solutions child pages */
  .ubind-m-sub-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font: inherit;
    font-size: 15px;
    text-align: left;
    border: 0;
    background: none;
    cursor: pointer;
  }

  .ubind-m-sub-toggle .ubind-caret {
    color: rgba(255, 255, 255, .5);
  }

  .ubind-m-accordion.open .ubind-m-sub-toggle .ubind-caret {
    transform: rotate(180deg);
  }

  .ubind-m-sub {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .28s var(--ub-ease-out);
  }

  .ubind-m-accordion.open .ubind-m-sub {
    grid-template-rows: 1fr;
  }

  .ubind-m-sub-inner {
    overflow: hidden;
  }

  .ubind-m-child {
    display: block;
    padding: 10px 14px 10px 28px;
    border-radius: 10px;
    color: rgba(255, 255, 255, .68);
    font-size: 14px;
    text-decoration: none;
    transition: background .2s, color .2s;
  }

  .ubind-m-child:hover,
  .ubind-m-child:focus-visible {
    background: rgba(255, 255, 255, .06);
    color: #ffffff;
  }

  .ubind-m-divider {
    height: 1px;
    margin: 8px 6px;
    background: rgba(255, 255, 255, .08);
  }

  @media (max-width: 920px) {
    .ubind-nav-links {
      display: none;
    }

    .ubind-hamburger {
      display: flex;
    }

    .ubind-nav {
      padding: 8px 8px 8px 16px;
    }
  }

  @media (min-width: 921px) {
    .ubind-mobile-menu {
      display: none;
    }
  }

  @media (max-width: 480px) {
    .ubind-header-wrap {
      top: 12px;
      padding: 0 12px;
    }

    .ubind-nav {
      width: 100%;
      justify-content: space-between;
    }

    .ubind-logo {
      font-size: 16px;
    }

    .ubind-btn {
      font-size: 13px;
      padding: 9px 14px;
    }
  }

  .elementor .e-div-block-base {
    padding: 0px !important;
  }
   /*.ubind-footer-contact h5 {*/
    /*  padding-bottom: 12px;*/
    /*  border-bottom: 1px solid #2ecc8f;*/
    /*  margin-bottom: 18px;*/
    /*}*/
    .ubind-footer-contact p {
        /*color: #7d8ea0;*/
        line-height: 1.6;
        margin: 0 0 14px;
    }

    .ubind-footer-contact a {
        color: #2ecc8f;
        text-decoration: none;
    }

    .ubind-footer-contact a:hover {
        text-decoration: underline;
    }

    :root {
	/* tokens now in the uBind Design Tokens plugin */
}

    .ubind-footer,
    .ubind-footer * {
        box-sizing: border-box;
    }

    .ubind-footer {
        background: #050807;
        color: rgba(255, 255, 255, .7);
        padding: 80px 0 40px;
        border-top: 1px solid rgba(255, 255, 255, .06);
        font-family: var(--ub-body);
    }

    .ubind-footer-container {
        width: 100%;
        max-width: 1320px;
        margin: 0 auto;
        padding: 0 32px;
    }

    .ubind-footer-grid {
        display: grid;
        grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr;
        gap: 40px;
        margin-bottom: 60px;
    }

    .ubind-footer-brand {
        max-width: 340px;
    }

    .ubind-footer-logo {
        display: flex;
        align-items: center;
        gap: 10px;
        color: #ffffff;
        font-weight: 600;
        font-size: 22px;
        letter-spacing: -0.02em;
        margin-bottom: 18px;
        text-decoration: none;
    }

    .ubind-footer-logo svg {
        width: 34px;
        height: 34px;
        color: var(--ub-emerald-400);
        display: block;
    }

    .ubind-footer-logo .u {
        color: var(--ub-emerald-400);
    }

    .ubind-footer-tag {
        font-family: var(--ub-mono);
        font-size: 12px;
        color: var(--ub-emerald-400);
        letter-spacing: 0.1em;
        text-transform: uppercase;
    }

    .ubind-footer-brand p {
        font-size: 14.5px;
        line-height: 1.6;
        margin-top: 16px;
        margin-bottom: 0;
        color: rgba(255, 255, 255, .62);
    }

    .ubind-footer-col h2 {
        color: #ffffff;
        font-size: 13px;
        font-family: var(--ub-mono);
        letter-spacing: 0.1em;
        text-transform: uppercase;
        margin: 0 0 18px;
        font-weight: 600;
    }

    .ubind-footer-col ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .ubind-footer-col li {
        padding: 6px 0;
    }

    .ubind-footer-col a {
        color: rgba(255, 255, 255, .6);
        font-size: 14px;
        transition: color .2s, transform .2s;
        text-decoration: none;
        display: inline-block;
    }

    .ubind-footer-col a:hover {
        color: var(--ub-emerald-400);
        transform: translateX(3px);
    }

    .ubind-compliance-row {
        display: flex;
        gap: 12px;
        margin-top: 24px;
        flex-wrap: wrap;
    }

    .ubind-compliance-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 6px 12px;
        background: rgba(255, 255, 255, .04);
        border: 1px solid rgba(255, 255, 255, .08);
        border-radius: 8px;
        font-family: var(--ub-mono);
        font-size: 11px;
        color: rgba(255, 255, 255, .7);
        letter-spacing: 0.06em;
        white-space: nowrap;
    }

    .ubind-compliance-badge svg {
        color: var(--ub-emerald-400);
        flex-shrink: 0;
    }

    /* ===== Footer bottom — centered, stacked ===== */
    .ubind-footer-bottom {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 18px;
        padding-top: 36px;
        border-top: 1px solid rgba(255, 255, 255, .06);
        font-size: 13px;
        color: rgba(255, 255, 255, .4);
    }

    /* social icons */
    .ubind-footer-social {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
    }

    .ubind-footer-social a {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        background: #ffffff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--ub-emerald-500);
        transition: transform .2s ease, background .2s ease, color .2s ease;
    }

    .ubind-footer-social a:hover {
        transform: translateY(-2px);
        background: var(--ub-emerald-400);
        color: #ffffff;
    }

    .ubind-footer-social svg {
        width: 16px;
        height: 16px;
        display: block;
    }

    /* copyright */
    .ubind-footer-copy {
        color: rgba(255, 255, 255, .5);
    }

    /* legal links */
    .ubind-footer-legal {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        row-gap: 8px;
    }

    .ubind-footer-legal a {
        position: relative;
        padding: 0 16px;
        color: rgba(255, 255, 255, .55);
        text-decoration: none;
        transition: color .2s;
    }

    .ubind-footer-legal a:hover {
        color: var(--ub-emerald-400);
    }

    .ubind-footer-legal a:not(:last-child)::after {
        content: "";
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 1px;
        height: 13px;
        background: rgba(255, 255, 255, .22);
    }

    @media (max-width: 900px) {
        .ubind-footer-grid {
            grid-template-columns: 1fr 1fr;
        }

        .ubind-footer-brand {
            max-width: none;
            grid-column: 1 / -1;
        }
    }

    @media (max-width: 600px) {
        .ubind-footer {
            padding: 60px 0 32px;
        }

        .ubind-footer-container {
            padding: 0 20px;
        }

        .ubind-footer-grid {
            grid-template-columns: 1fr;
            gap: 32px;
            margin-bottom: 44px;
        }

        .ubind-footer-bottom {
            align-items: center;
            text-align: center;
        }

        .ubind-footer-legal a {
            padding: 0 12px;
        }
    }












/* BEGIN Soho Gothic Pro (self-hosted) */
/* Self-hosted under uBind's Monotype webfont licence. Uploaded via the WordPress
   Font Library. @font-face declarations are lazy: a visitor downloads only the
   faces their page actually uses, not all 14. */
/* END Soho Gothic Pro */

/* BEGIN uBind heading emphasis */
/*
   The italic green phrase inside a heading - "Market-leading features for
   <em>innovative insurance offerings.</em>". One class, defined once, site-wide.
   Every page previously carried its own copy of these rules; they have been
   removed in favour of this block. Edit the treatment here and nowhere else.

       <em class="u-em">                 default green, reads on light or dark
       <em class="u-em u-em--on-light">   darker stops, for pale cards/sections
       <em class="u-em u-em--on-dark">    lighter stops, for dark bands and CTAs

   GEOMETRY - why the padding/margin pair exists.
   The gradient is clipped to the glyph shapes, but it can only paint inside the
   element's background box, so any ink outside that box simply goes missing.
   Two things push ink outside it: italic letterforms lean past their advance
   width, and .h-display's negative letter-spacing (-0.028em) pulls the box in
   past the final glyph on top of that. Measured on the features hero at 78px the
   right edge loses 3.58px (0.046em) - a visible nick out of the last character.
   The padding grows the paint box; the equal negative margin cancels the growth
   so layout is untouched (vertical margins are ignored on inline elements, and
   the vertical padding cannot affect line height either, so only the horizontal
   pair has any layout effect - and it nets to zero).

   box-decoration-break:clone repeats that padding on EVERY line of a heading
   that wraps. Without it padding-right lands only on the final fragment, so a
   three-line heading still loses the right edge of lines one and two - which is
   the failure this is here to fix. The trade-off is that each line then paints
   its own full gradient rather than sharing one sweep across all lines; that is
   the single deliberate visual change in this block.

   The !important on the geometry is not defensive habit - it is required. Every
   page opens with its own blanket reset, and several are ID-scoped, e.g.
   "#ubind-features-page, #ubind-features-page * { margin: 0; padding: 0 }".
   An ID beats a class, so without !important the reset silently zeroes the
   padding and the fix does nothing at all (verified: 24 of 26 emphases on the
   features page came back with padding 0). Only the geometry needs it; the
   colours win on their own now the per-page em rules are gone.
*/
.u-em {
    --u-em-from: var(--emerald-500, #1fa67a);
    --u-em-to: var(--emerald-700, #0f5c47);

    font-style: italic;
    background-image: linear-gradient(135deg, var(--u-em-from), var(--u-em-to));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;

    padding: 0 .12em .18em 0 !important;
    margin: 0 -.12em -.18em 0 !important;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

.u-em--on-light {
    --u-em-from: var(--emerald-600, #128a5f);
    --u-em-to: var(--emerald-800, #0a3d31);
}

.u-em--on-dark {
    --u-em-from: var(--emerald-300, #69e0b0);
    --u-em-to: var(--emerald-400, #39b591);
}

/* Display headings set the emphasis a weight lighter than the heading itself.
   Scoped to .h-display so card and section headings keep inheriting their own
   weight, exactly as they did before. */
.h-display .u-em {
    font-weight: 300;
}

/* The rotating hero word is the same treatment on a positioned span rather than
   an <em>, so it needs the geometry but not the colour. It is an inline-block,
   which makes its paint box the line-height box (1.05) instead of the roomier
   font-metrics box an inline gets - so unlike the <em>s, this one really does
   clip descenders vertically, which is what the .18em is for. */
.word-swap .word,
.hs-wordswap .hs-word {
    padding: 0 .12em .18em 0 !important;
    margin: 0 -.12em -.18em 0 !important;
}

/* END uBind heading emphasis */

/* === ubind news grid buttons (managed) === */
.elementor-widget-posts .elementor-button {
	background-color: var(--emerald-500, #1fa67a) !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 14px 22px !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	line-height: 1.2 !important;
}

.elementor-widget-posts .elementor-button .elementor-button-text {
	color: inherit !important;
}

.elementor-widget-posts .elementor-button:hover,
.elementor-widget-posts .elementor-button:focus-visible {
	background-color: var(--emerald-600, #128a5f) !important;
	color: #fff !important;
}

.elementor-posts .elementor-post__read-more {
	color: var(--emerald-600, #128a5f) !important;
	display: block !important;
	width: fit-content !important;
	margin-left: auto !important;
}

/* Elementor's stock CSS only gives the thumbnail width:100%; the "cover" crop is faked by its
   JavaScript, which measures each image and writes an inline transform. That JS never runs for
   the cards Load More appends, so those fall back to width-only sizing and letterbox any source
   wider than the tile - the Opera House sat 91px short of its box, Zest 39px. object-fit does the
   same job declaratively, identically on both paths, and needs no JavaScript at all. The inset
   and transform resets neutralise the inline styles the handler leaves on server-rendered cards. */
.elementor-posts-container .elementor-post__thumbnail img {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: auto !important;
	bottom: auto !important;
	width: 100% !important;
	height: 100% !important;
	transform: none !important;
	object-fit: cover !important;
	object-position: center !important;
}
/* === end ubind news grid buttons === */



/* BEGIN uBind theme button reset */
/* Hello Elementor's reset.css ships a placeholder button style:
 *
 *   [type="button"], [type="reset"], [type="submit"], button {
 *     border: 1px solid #c36; border-radius: 3px; color: #c36; padding: .5rem 1rem; ... }
 *
 * #c36 is the theme's "nobody has styled this yet" marker, and it is meant to be overridden.
 * Every redesign page carries its own `button { border: none; background: none; color: inherit }`
 * reset for that, but a type selector scores 0,0,1 and the theme's attribute selector scores
 * 0,1,0 - so the theme wins and the pink-red border survives on any control a page styles by
 * class without naming a border of its own.
 *
 * Nothing showed it while these controls were <div>s, because reset.css cannot reach a div.
 * Making them real keyboard-operable <button type="button">s on 2026-08-21 is what let the
 * theme's placeholder through, on the two tab strips and on two wizard controls whose page
 * stylesheets never declare a border.
 *
 * Scoped deliberately rather than reset across all buttons: plenty of controls on this site
 * (.opt-card, .sev-pick-card, .cap, .mini-btn, .ubind-hamburger, .dcm-tab) do draw a real
 * border from a class rule of the same 0,1,0 specificity in an earlier stylesheet, and a
 * blanket `button { border: 0 }` here would load later and erase those too. Tag+class scores
 * 0,1,1, so each of these beats the theme wherever it lands, whatever the load order.
 *
 * These four are borderless by design: the tab strips carry their outline on the surrounding
 * .channel-tabs / .workflow-tabs pill, and the shared contact wizard already forces
 * `.btn-step, .btn-back { border-style: none !important }` in template 199 - the security-issue
 * fork of that wizard is the copy that missed it. */
button.ch-tab,
button.wf-tab,
button.btn-primary,
button.btn-back {
  border: 0;
}
/* END uBind theme button reset */