/* The Underlinks v1.0.2 universal public theme layer.
   Loaded last so one public header and one hero palette remain consistent. */

/* One header component for the homepage and every public inner page. */
.underlinks-public-header,
.underlinks-public-header.is-sticky,
.underlinks-public-header.nav-light,
.underlinks-public-header.nav-dark,
.underlinks-public-header.nav-light.is-sticky,
.underlinks-public-header.nav-dark.is-sticky {
    width: 100% !important;
    min-height: var(--theme-header-height, 88px) !important;
    height: auto !important;
    padding-left: clamp(16px, 3.3vw, 48px) !important;
    padding-right: clamp(16px, 3.3vw, 48px) !important;
    position: relative !important;
    top: auto !important;
    background: var(--theme-header-bg, #031427) !important;
    color: var(--theme-menu-text, #fff) !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--theme-menu-text, #fff) 14%, transparent) !important;
    box-shadow: 0 8px 24px color-mix(in srgb, var(--theme-header-bg, #031427) 18%, transparent) !important;
    z-index: 1040 !important;
}
.underlinks-public-header.theme-sticky-header,
.underlinks-public-header.theme-sticky-header.is-sticky {
    position: sticky !important;
    top: 0 !important;
}
.underlinks-public-header .navbar,
.underlinks-public-header .desktop-nav,
.underlinks-public-header .mobile-responsive-nav,
.underlinks-public-header .mobile-responsive-menu,
.underlinks-public-header .offcanvas,
.underlinks-public-header .offcanvas-header,
.underlinks-public-header .offcanvas-body {
    background: var(--theme-header-bg, #031427) !important;
    color: var(--theme-menu-text, #fff) !important;
}
.underlinks-public-header .navbar {
    min-height: var(--theme-header-height, 88px) !important;
    height: auto !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}
.underlinks-public-header .mobile-responsive-menu {
    min-height: var(--theme-header-height, 88px) !important;
    height: auto !important;
}
.underlinks-public-header .navbar-brand,
.underlinks-public-header .mobile-responsive-menu .logo {
    width: auto !important;
    max-width: min(230px, 32vw) !important;
    height: auto !important;
}
.underlinks-public-header .navbar-brand img.main-logo,
.underlinks-public-header .navbar-brand img.white-logo,
.underlinks-public-header .mobile-responsive-menu .logo img {
    width: auto !important;
    max-width: 100% !important;
    max-height: var(--theme-logo-height, 54px) !important;
    object-fit: contain !important;
}
body[data-header-tone="dark"] .underlinks-public-header .main-logo { display: none !important; }
body[data-header-tone="dark"] .underlinks-public-header .white-logo { display: block !important; }
body[data-header-tone="light"] .underlinks-public-header .white-logo { display: none !important; }
body[data-header-tone="light"] .underlinks-public-header .main-logo { display: block !important; }

.underlinks-public-header .desktop-nav .offcanvas-body > .navbar-nav {
    gap: var(--theme-menu-link-gap, 14px) !important;
}
.underlinks-public-header .desktop-nav .offcanvas-body > .navbar-nav > .nav-item > .nav-link,
.underlinks-public-header .nav-others > a,
.underlinks-public-header .nav-others > button,
.underlinks-public-header .nav-others .nav-link,
.underlinks-public-header :where(.responsive-burger-menu i, .offcanvas-header i) {
    color: var(--theme-menu-text, #fff) !important;
    font-family: var(--theme-nav-font, Inter, Arial, sans-serif) !important;
    font-size: var(--theme-menu-font-size, 16px) !important;
    line-height: 1.25 !important;
}
.underlinks-public-header .desktop-nav .offcanvas-body > .navbar-nav > .nav-item > .nav-link:hover,
.underlinks-public-header .desktop-nav .offcanvas-body > .navbar-nav > .nav-item > .nav-link:focus,
.underlinks-public-header .desktop-nav .offcanvas-body > .navbar-nav > .nav-item > .nav-link.active {
    color: var(--theme-accent, #2f6bff) !important;
}

.underlinks-public-header .nav-others .button,
.underlinks-public-header .nav-others .btn { color: var(--theme-button-text, #fff) !important; }
.underlinks-public-header .nav-others .button.-secondary {
    background: var(--theme-card-bg, #fff) !important;
    color: var(--theme-card-text, #17212b) !important;
    border-color: var(--theme-border, #dce2ea) !important;
}

/* Dropdowns are theme cards, preventing white text on white menus. */
.underlinks-public-header .dropdown-menu,
.underlinks-public-header .dropdown-menu li {
    background: var(--theme-card-bg, #fff) !important;
    color: var(--theme-card-text, #17212b) !important;
    border-color: var(--theme-border, #dce2ea) !important;
}
.underlinks-public-header .dropdown-menu :where(.nav-link, .dropdown-item, a, span, i) {
    color: var(--theme-card-text, #17212b) !important;
    background: transparent !important;
    font-size: calc(var(--theme-menu-font-size, 16px) - 1px) !important;
}
.underlinks-public-header .dropdown-menu :where(.nav-link, .dropdown-item, a):hover,
.underlinks-public-header .dropdown-menu :where(.nav-link, .dropdown-item, a):focus,
.underlinks-public-header .dropdown-menu :where(.nav-link, .dropdown-item, a).active {
    color: var(--theme-heading-text, #0b1f33) !important;
    background: color-mix(in srgb, var(--theme-accent, #2f6bff) 14%, transparent) !important;
}

/* Theme Studio menu size, spacing and alignment apply to every public page. */
@media (min-width: 992px) {
    body[data-menu-alignment="center"] .underlinks-public-header .desktop-nav .navbar-collapse {
        position: absolute !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: auto !important;
        max-width: calc(100% - 420px) !important;
        justify-content: center !important;
    }
    body[data-menu-alignment="center"] .underlinks-public-header .desktop-nav .offcanvas-body { justify-content: center !important; }

    body[data-menu-alignment="left"] .underlinks-public-header .desktop-nav .navbar-collapse,
    body[data-menu-alignment="right"] .underlinks-public-header .desktop-nav .navbar-collapse {
        position: static !important;
        left: auto !important;
        transform: none !important;
        width: auto !important;
        max-width: none !important;
        flex: 1 1 auto !important;
    }
    body[data-menu-alignment="left"] .underlinks-public-header .desktop-nav .offcanvas-body { justify-content: flex-start !important; }
    body[data-menu-alignment="right"] .underlinks-public-header .desktop-nav .offcanvas-body { justify-content: flex-end !important; }
}

/* Home and inner pages use the exact same selected hero image, overlay and palette. */
.ts-hero,
.ts-page-hero,
.page-banner-area {
    position: relative !important;
    isolation: isolate;
    overflow: hidden !important;
    background-color: var(--theme-hero-bg, #02101f) !important;
    background-image: var(--theme-hero-surface, linear-gradient(var(--theme-overlay, rgba(2,16,31,.78)), var(--theme-overlay, rgba(2,16,31,.78)))) !important;
    background-position: var(--theme-background-position, center center) !important;
    background-size: var(--theme-background-size, cover) !important;
    background-repeat: no-repeat !important;
    color: var(--theme-hero-text, #fff) !important;
}
.underlinks-home-page .ts-hero { padding-top: clamp(90px, 10vw, 135px) !important; }
.ts-page-hero,
.underlinks-inner-page .page-banner-area {
    padding-top: clamp(72px, 8vw, 112px) !important;
    padding-bottom: clamp(68px, 7vw, 104px) !important;
    margin-top: 0 !important;
    border-bottom: 3px solid color-mix(in srgb, var(--theme-accent, #2f6bff) 72%, transparent) !important;
}
.ts-hero :where(h1,h2,h3,h4,h5,h6,p,.text,.paragraph,.ts-hero-eyebrow,.ts-hero-description),
.ts-page-hero :where(h1,h2,h3,h4,h5,h6,p,a,li,span,.breadcrumb-item,.breadcrumb-item.active),
.page-banner-area :where(h1,h2,h3,h4,h5,h6,p,a,li,span,.breadcrumb-item,.breadcrumb-item.active) {
    color: var(--theme-hero-text, #fff) !important;
}
.ts-hero .ts-hero-highlight,
.ts-hero .ts-hero-eyebrow,
.ts-page-hero .breadcrumb-item a,
.page-banner-area .breadcrumb-item a { color: var(--theme-accent, #2f6bff) !important; }
.ts-page-hero .breadcrumb,
.page-banner-area .breadcrumb { margin-top: 12px !important; margin-bottom: 0 !important; }
.ts-page-hero .breadcrumb-item + .breadcrumb-item::before,
.page-banner-area .breadcrumb-item + .breadcrumb-item::before {
    color: color-mix(in srgb, var(--theme-hero-text, #fff) 68%, transparent) !important;
}

/* Homepage preview card remains readable in every theme. */
.ts-hero .ts-artist-demo {
    background: color-mix(in srgb, var(--theme-hero-bg, #02101f) 86%, var(--theme-card-bg, #fff)) !important;
    color: var(--theme-hero-text, #fff) !important;
    border-color: color-mix(in srgb, var(--theme-hero-text, #fff) 34%, transparent) !important;
    box-shadow: var(--theme-card-shadow, 0 16px 38px rgba(15, 23, 42, .14)) !important;
}
.ts-hero .ts-artist-demo :where(h1,h2,h3,h4,h5,h6,p,span,a,.ts-artist-subtitle) {
    color: var(--theme-hero-text, #fff) !important;
}
.ts-hero .ts-artist-demo .ts-artist-subtitle { opacity: .78 !important; }
.ts-hero .ts-demo-link {
    color: var(--theme-hero-text, #fff) !important;
    background: color-mix(in srgb, var(--theme-hero-text, #fff) 6%, transparent) !important;
    border-color: color-mix(in srgb, var(--theme-hero-text, #fff) 20%, transparent) !important;
}
.ts-hero .ts-demo-link:hover { background: color-mix(in srgb, var(--theme-accent, #2f6bff) 24%, transparent) !important; }

/* Inner page surfaces derive from the same selected page and card colors. */
.underlinks-inner-page :where(.our-feature-request,.our-contact-form,.our-pricing,.pricing-area,.our-blog,.blog-area,.blog-section,.verification-area) {
    background: var(--theme-page-bg, #f5f7fa) !important;
}
.underlinks-inner-page :where(.card,.blog-wrap,.pricing-table .item-box,.accordion-item,.widget,.term-content,.info-box,.list-group-item) {
    background: var(--theme-card-bg, #fff) !important;
    color: var(--theme-card-text, #17212b) !important;
    border-color: var(--theme-border, #dce2ea) !important;
}
.underlinks-inner-page :where(.card,.blog-wrap,.pricing-table .item-box,.accordion-item,.widget,.term-content,.info-box,.list-group-item) :where(p,li,td,th,label,small,strong,span,.text,.paragraph,.description) {
    color: var(--theme-card-text, #17212b) !important;
}
.underlinks-inner-page :where(.card,.blog-wrap,.pricing-table .item-box,.accordion-item,.widget,.term-content,.info-box,.list-group-item) :where(h1,h2,h3,h4,h5,h6,.title,.card-title) {
    color: var(--theme-heading-text, #0b1f33) !important;
}
.underlinks-inner-page .term-content { padding: clamp(24px, 4vw, 42px) !important; }

.ts-section-white { background: color-mix(in srgb, var(--theme-page-bg, #f5f7fa) 84%, var(--theme-card-bg, #fff)) !important; }
.ts-section-dark,
.ts-stat-panel { background: var(--theme-hero-bg, #02101f) !important; color: var(--theme-hero-text, #fff) !important; }
.ts-stat-panel :where(strong,span,p,h1,h2,h3,h4,h5,h6) { color: var(--theme-hero-text, #fff) !important; }

@media (max-width: 991px) {
    .underlinks-public-header,
    .underlinks-public-header.is-sticky { padding-left: 16px !important; padding-right: 16px !important; }
    .underlinks-public-header .offcanvas,
    .underlinks-public-header .offcanvas-header,
    .underlinks-public-header .offcanvas-body { background: var(--theme-header-bg, #031427) !important; }
    .underlinks-public-header .offcanvas-body > .navbar-nav > .nav-item > .nav-link {
        color: var(--theme-menu-text, #fff) !important;
        font-size: var(--theme-menu-font-size, 16px) !important;
    }
    .underlinks-public-header .dropdown-menu { box-shadow: none !important; }
    .underlinks-home-page .ts-hero { padding-top: 72px !important; }
    .ts-page-hero,
    .underlinks-inner-page .page-banner-area { padding-top: 58px !important; padding-bottom: 58px !important; }
}