/* template blog faqs glossary additionals tyles for new templates*/
/* Table of Contents Container */
.custom-toc-wrapper {
    width: 100%;
    max-width: 400px;
    min-width: 280px;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    gap: 16px;
    box-sizing: border-box;
    font-family: "Encode Sans Condensed", sans-serif, system-ui;
}

/* Header Section */
.custom-toc-header {
    display: flex;
    align-items: center;
    gap: 12px;
}

.custom-toc-icon-bg {
    width: 48px;
    height: 48px;
    background: #1C394F;
    border-radius: 1000px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}

.custom-toc-title {
    color: #1C394F;
    font-size: 28px;
    font-weight: 600;
    line-height: 36px;
    letter-spacing: 0.64px;
}

/* List Items */
.custom-toc-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.custom-toc-item {
    padding: 8px 20px;
    background: #ffffff;
    border-left: 3px solid rgba(99, 153, 182, 0.40);
    transition: all 0.2s ease-in-out;
}

.custom-toc-item a {
    color: #1C394F !important;
    font-size: 16px;
    font-weight: 600;
    line-height: 22.5px;
    letter-spacing: 0.54px;
    text-decoration: none;
    display: block;
}

.custom-toc-item a:hover,
.custom-toc-item a:visited,
.custom-toc-item a:focus,
.custom-toc-item.is-active a:hover,
.custom-toc-item.is-active a {
    color: #1C394F !important;
    text-decoration: none !important;
}

.section.main article .custom-toc-item a:link,
.section.main article .custom-toc-item a:visited,
.section.main article .custom-toc-item a:hover,
.section.main article .custom-toc-item a:focus,
.section.main article .custom-toc-item a:active {
    color: #1C394F !important;
    text-decoration: none !important;
}

.section.main article .small-text a:link,
.section.main article .small-text a:visited,
.section.main article .small-text a:focus,
.section.main article .small-text a:active {
    color: #1A73E8 !important;
    text-decoration: none !important;
}
.section.main article .small-text a:hover {
    color: #f36523 !important;
    text-decoration: underline !important;
}

/* Sub-heading Indentation */
.custom-toc-item.toc-level-h3 {
    padding-left: 32px;
}
.custom-toc-item.toc-level-h4 {
    padding-left: 44px;
}

/* Active & Hover States */
.custom-toc-item:hover,
.custom-toc-item.is-active {
    border-left-color: #1C394F;
}

.custom-toc-item.is-active a {
    font-weight: 700;
}

/* Sticky Sidebar Helper Class */
.sticky-toc-sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 24px;
    z-index: 10;
}

/*    */



/* Safely target ONLY headings inside your main copy section */
/*.copy-section-content :is(h1, h2, h3, h4, h5, h6)[id],*/
/*.copy-section-content [id^="toc-"] {*/
/*    scroll-margin-top: 150px !important; !* 120px Header + 20px breathing room *!*/
/*}*/
html {
    scroll-behavior: smooth;
}

/*reset some old tweak... atleast and hope that only for this tempalte and this section./*/
.copy-section-content :target:before {
    height: unset !important;
    margin: unset !important;
}

/* 2. Offset nativ de 150px (120px Header + 30px spațiu)
      pentru TOATE titlurile și elementele cu ID din articol */
/* Scroll-margin nativ pentru oricare titlu sau element cu ID din continut */
.copy-section-content h1[id],
.copy-section-content h2[id],
.copy-section-content h3[id],
.copy-section-content h4[id],
.copy-section-content h5[id],
.copy-section-content h6[id],
.copy-section-content [id] {
    /*scroll-margin-top: 150px !important; !* 120px Header + 30px spațiu de respirație *!*/
}

/* Flex Container Layout */
.copy-section {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 40px;
    max-width: 1140px;
    margin: 0 auto;
    box-sizing: border-box;
}

/* Main Content Area */
.copy-section-content {
    width: 100%;
    /*max-width: 555px;*/
    /*flex: 0 1 555px;*/
    flex: 1 1 auto;
    min-width: 0;
}

/* If no sidebar exists, ensure content stays cleanly centered */
.copy-section:not(:has(.copy-section-sidebar)) {
    justify-content: center;
}

/* Sidebar Wrapper */
.copy-section-sidebar {
    width: 380px;
    flex: 0 0 380px;
    align-self: stretch;
}

/* Sticky Mechanics with 120px Header Offset */
.sticky-toc-inner {
    position: -webkit-sticky;
    position: sticky;
    top: 140px; /* 120px header height + 20px extra spacing */
    max-height: calc(100vh - 160px); /* Adjust max-height to fit inside viewport */
    overflow-y: auto;
}

/* Hide legacy inline .takeaway when sidebar ToC is active */
/*.copy-section-sidebar + .copy-section-content .takeaway,*/
/*.copy-section:has(.copy-section-sidebar) .takeaway {*/
/*    display: none !important;*/
/*}*/

/* Mobile & Tablet Fallback */
@media (max-width: 1024px) {
    .copy-section {
        flex-direction: column;
        align-items: center;
        gap: 24px;
    }

    .copy-section-sidebar {
        width: 100%;
        max-width: 555px;
        flex: 0 1 auto;
    }

    .sticky-toc-inner {
        position: static;
        max-height: none;
    }
}

/*    */
/* ==========================================================================
MOBILE FLOATING BAR & JUMP TO DRAWER
========================================================================== */

/* Hide mobile elements on desktop */
@media screen and (min-width: 992px) {
    .mobile-only,
    .custom-toc-close-btn,
    .custom-toc-jump-title,
    .custom-toc-trigger-btn {
        display: none !important;
    }
}

/* Mobile Rules (<= 991px) */
@media screen and (max-width: 991px) {
    .desktop-only {
        display: none !important;
    }

    /* Floating Bar Outer Wrapper (Pill Box) */
    .custom-cta-toc-wrapper {
        position: fixed !important;
        bottom: 16px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: calc(100% - 32px) !important;
        max-width: 420px !important;
        background: #ffffff !important;
        box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.12) !important;
        border-radius: 1000px !important;
        outline: 1px solid #DBDBDB !important;
        padding: 8px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        z-index: 99999 !important;
        box-sizing: border-box !important;
    }

    /* "In this article" Trigger Button */
    .custom-toc-trigger-btn {
        height: 48px !important;
        flex: 1 !important;
        background: #DEECFF !important;
        border-radius: 1000px !important;
        border: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        padding: 0 16px !important;
        cursor: pointer !important;
    }

    .custom-toc-trigger-btn span {
        color: #1C394F !important;
        font-size: 20px !important;
        font-family: "Encode Sans Condensed", sans-serif !important;
        font-weight: 700 !important;
        line-height: 25px !important;
        letter-spacing: 0.40px !important;
    }

    /* Reset Existing Phone CTA inside Wrapper on Mobile */
    .custom-cta-toc-wrapper #phone_cta_widget {
        flex: 1 !important;
        margin: 0 !important;
        position: relative !important;
        bottom: auto !important;
        left: auto !important;
    }

    .custom-cta-toc-wrapper #phone_cta_widget .phone_cta_widget_show {
        height: 48px !important;
        width: 100% !important;
        background: #1C394F !important;
        border-radius: 1000px !important;
        color: #ffffff !important;
        font-size: 20px !important;
        font-family: "Encode Sans Condensed", sans-serif !important;
        font-weight: 700 !important;
        line-height: 25px !important;
        letter-spacing: 0.40px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        padding: 0 16px !important;
        border: none !important;
    }

    /* Mobile TOC Drawer Container */
    /*.custom-toc-wrapper {*/
    /*    position: fixed !important;*/
    /*    bottom: -100% !important;*/
    /*    left: 0 !important;*/
    /*    right: 0 !important;*/
    /*    width: 100% !important;*/
    /*    max-width: 100% !important;*/
    /*    max-height: 80vh !important;*/
    /*    overflow-y: auto !important;*/
    /*    z-index: 999999 !important;*/
    /*    border-radius: 16px 16px 0 0 !important;*/
    /*    box-shadow: 0px -4px 20px rgba(0, 0, 0, 0.2) !important;*/
    /*    transition: bottom 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;*/
    /*    background: #ffffff !important;*/
    /*    padding: 20px !important;*/
    /*    margin: 0 !important;*/
    /*}*/

    /*.custom-toc-wrapper.is-open {*/
    /*    bottom: 0 !important;*/
    /*}*/
    /* Mobile TOC Drawer Container (Floats above bottom bar) */
    .custom-toc-wrapper {
        position: fixed !important;
        /* Start hidden below screen */
        bottom: -100% !important;
        left: 50% !important;
        transform: translateX(-50%) !important;

        /* Floating dimensions */
        width: calc(100% - 32px) !important;
        max-width: 420px !important;
        max-height: 70vh !important;
        overflow-y: auto !important;

        z-index: 999999 !important;
        border-radius: 16px !important;
        box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.2) !important;
        transition: bottom 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease !important;
        background: #ffffff !important;
        padding: 20px !important;
        margin: 0 !important;
        opacity: 0;
        visibility: hidden;
    }

    /* Active state: position exact distance above the 64px floating bar + 16px bottom offset + 8px gap = 88px */
    .custom-toc-wrapper.is-open {
        bottom: 88px !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    /* Clean spacing inside popup */
    .custom-toc-wrapper .custom-toc-list {
        display: flex !important;
        flex-direction: column !important;
        gap: 4px !important;
    }
    /**/

    /* Hide Desktop Circle Header on Mobile Popup */
    .custom-toc-wrapper .custom-toc-icon-bg,
    .custom-toc-wrapper .custom-toc-title {
        display: none !important;
    }

    .custom-toc-header {
        justify-content: flex-end !important;
    }

    /* Mobile Close Button */
    .custom-toc-close-btn {
        background: none !important;
        border: none !important;
        font-size: 28px !important;
        line-height: 1 !important;
        color: #1C394F !important;
        cursor: pointer !important;
    }

    /* "Jump to" Mobile Title */
    .custom-toc-jump-title {
        display: block !important;
        color: #1C394F !important;
        font-size: 16px !important;
        font-family: "Encode Sans Condensed", sans-serif !important;
        font-weight: 600 !important;
        line-height: 22.40px !important;
        letter-spacing: 0.48px !important;
        margin-bottom: 8px !important;
    }

    /* Backdrop Overlay */
    .custom-toc-backdrop {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        background: rgba(0, 0, 0, 0.4) !important;
        z-index: 999998 !important;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }

    .custom-toc-backdrop.is-open {
        opacity: 1 !important;
        visibility: visible !important;
    }
}

@media screen and (max-width: 991px) {
    .custom-cta-toc-wrapper #phone_cta_widget {
        right: 0 !important;
        bottom: 0 !important;
        margin-bottom: -41px !important;
    }
}
/*    */
article p.breadcrumbs {
    max-width: 1140px;
    margin: 15px auto !important;
    padding: 0 30px !important;
}
@media (max-width: 768px){
    article p.breadcrumbs {
        padding: 0 20px !important;
    }
}
h2{
    color: #50738f !important;
    font-weight: 600 !important;
}
.section.main article h2 {
    color: #50738f !important;
    font-weight: 600;
}
h2.faqs_title {
    text-align: center !important;
}

/*new styles according to new temapltes design*/
/* ==========================================================================
   State Lead Form Sidebar Layout (Dedicated for .template-content-layout-wrapper)
   ========================================================================== */

/* 1. Flex Container Principal - Aliniat la grilă (1140px) */
.template-content-layout-wrapper {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 40px;
    max-width: 1140px;
    margin: 30px auto 0;
    box-sizing: border-box;
    width: 100%;
}

/* 2. Coloana Principală de Conținut */
.template-content-layout-wrapper .main-content-column {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    overflow: hidden !important;
}

/* 3. RESET TINTIT: Forțăm toate div-urile .copy-section din interiorul
   coloanei să renunțe la latimea fixă veche (555px) și să fie fluide */
.template-content-layout-wrapper .main-content-column .copy-section,
.template-content-layout-wrapper .main-content-column .copy-section-content {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 4. Coloana Dreaptă de Sidebar (380px ca la TOC) */
.template-content-layout-wrapper .sidebar-lead-form-column {
    width: 380px;
    flex: 0 0 380px;
    align-self: stretch;
}

/* 5. Mecanica Sticky + Card Styling */
.template-content-layout-wrapper .sidebar-form-card {
    position: -webkit-sticky;
    position: sticky;
    top: 150px; /* 120px Header + 20px spațiu */
    max-height: calc(100vh - 160px);
    overflow-y: auto;
    background: #ffffff;
    padding: 0 !important;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* 6. Sectiunea de jos Full-Width (FAQ / Footnotes / CTA) */
.full-width-bottom-content {
    width: 100%;
    /*max-width: 1140px;*/
    margin: 40px auto 0;
    box-sizing: border-box;
}

/* ==========================================================================
   Mobile & Tablet Behavior
   ========================================================================== */

@media (max-width: 1024px) {
    .template-content-layout-wrapper {
        flex-direction: column;
        align-items: center;
        gap: 24px;
    }

    .template-content-layout-wrapper .sidebar-lead-form-column {
        width: 100%;
        max-width: 555px;
        flex: 0 1 auto;
    }

    .template-content-layout-wrapper .sidebar-form-card {
        position: static;
        max-height: none;
    }
}

/* Overwrites pentru lead form */

.hero-card + a.button.primary.small.border-radius-round.cta {
    margin-top: 1em
}

a.button.primary.small.border-radius-round.cta,
a.button.primary.small.border-radius-round.cta:hover,
a.button.primary.small.border-radius-round.cta:visited,
.hero-card + a.button.primary.small.border-radius-round.cta,
.hero-card + a.button.primary.small.border-radius-round.cta:hover,
.hero-card + a.button.primary.small.border-radius-round.cta:visited {
    color: #FFFFFF !important;
    text-align: center !important;
}

.lc:has(div.new-lead-form-wrap) + .rc img.imgdesktop {
    min-height: 467px;
    width: 100%;
    object-fit: cover;
    object-position: center center;
}

/* ==========================================================================
   Sidebar Lead Form Widget - Forced Mobile/Small Viewport Layout
   ========================================================================== */

/* 1. Forțăm comportamentul de direcție verticală (Coloană în loc de Row) */
.sidebar-form-card .sf_lead_gen_entry .content {
    padding: var(--hio-space-xl) var(--hio-space-lg) !important;
    flex-direction: column !important;
    align-items: initial !important;
}

/* 2. Resetăm padding-ul și bara colorată laterală ca pe mobil */
.sidebar-form-card .sf_lead_gen_entry .content .left-content {
    padding: initial !important;
    width: 100% !important;
}

.sidebar-form-card .sf_lead_gen_entry .content .left-content:before {
    display: none !important;
}

/* 3. Forțăm vizibilitățile (.hide-desktop devine vizibil, .hide-mobile se ascunde) */
.sidebar-form-card .hide-desktop {
    display: block !important;
}

.sidebar-form-card .hide-mobile {
    display: none !important;
}

/* 4. Ajustări suplimentare pentru încadrarea perfectă la 380px */
.sidebar-form-card .sf_lead_gen_entry {
    border-left: 1px solid #e2e8f0 !important; /* Opțional, dacă vreți border uniform */
}

.sidebar-form-card .inner_card {
    width: 100% !important;
    box-sizing: border-box;
}

/**/
/* ==========================================================================
   Mecanica de Afișare Sidebar la scroll, odata ce heroul eie din viewport - completat de js din pagina (Fără Layout Shift)
   ========================================================================== */

/* --------------------------------------------------------------------------
   OPȚIUNEA A: Spațiu rezervat + Slide & Fade-In (Cerința Clientului)
   -------------------------------------------------------------------------- */
.template-content-layout-wrapper .sidebar-form-card {
    opacity: 0;
    transform: translateY(24px); /* Pornește ușor de mai jos */
    transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none; /* Inactiv la click cât timp e ascuns */
}

/* Când Hero-ul a ieșit din ecran */
.template-content-layout-wrapper.hero-out-of-view .sidebar-form-card {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}


/* --------------------------------------------------------------------------
   OPȚIUNEA B: Opacitate Progresivă / Dimmed (15% ➔ 100%)
   * Dacă vrei Opțiunea B, comentează codul de la Opțiunea A și folosește-l pe acesta:
   -------------------------------------------------------------------------- */
/*
.template-content-layout-wrapper .sidebar-form-card {
    opacity: 0.15;
    filter: grayscale(50%);
    transition: opacity 0.35s ease, filter 0.35s ease;
}

.template-content-layout-wrapper.hero-out-of-view .sidebar-form-card {
    opacity: 1;
    filter: grayscale(0%);
}
*/

/* ==========================================================================
   Smooth Vertical Slide & Fade Transition (Enhanced Amplitude & Fluidity)
   ========================================================================== */

/* 1. Starea de BAZĂ (Ascuns - Cât timp Hero este pe ecran) */
.template-content-layout-wrapper .sidebar-form-card {
    opacity: 0;
    visibility: hidden;
    /* Distanță amplă de glisare pentru un efect vizibil și clar de coborâre/urcare */
    transform: translateY(-65px);
    pointer-events: none;

    /* Durată de 0.75s pentru un slide lent, elegant și premium */
    transition:
            transform 0.75s cubic-bezier(0.16, 1, 0.3, 1),
            opacity 0.6s ease-out,
            visibility 0.75s;

    will-change: transform, opacity;
}

/* 2. Starea VIZIBILĂ (Când Hero a ieșit din viewport) */
.template-content-layout-wrapper.hero-out-of-view .sidebar-form-card {
    opacity: 1;
    visibility: visible;
    /* Coboară lin în poziția fixă din layout */
    transform: translateY(0);
    pointer-events: auto;
}

/* ==========================================================================
   Sidebar Watermark / Background Logo (cât timp widget-ul este ascuns)
   ========================================================================== */

/* 1. Setăm fundalul pe coloana / cardul de sidebar */
.template-content-layout-wrapper .sidebar-lead-form-column {
    position: relative;
}

/* 2. Creăm un pseudo-element ::before pentru Logo (pentru a-i putea controla opacitatea separat) */
.template-content-layout-wrapper .sidebar-lead-form-column::before {
    content: "";
    position: absolute;
    top: 60px;
    left: 0;
    width: 90%;
    height: 300px; /* sau înălțimea dorită pentru zona de watermark */

    /* Drumul către logoul tău (SVG sau PNG transparent) */
    background-image: url("/wp-content/uploads/2026/09/hio_translucent_placeholder.webp");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center top;
    /* Opacitate subtilă pentru un efect elegant de filigran / watermark */
    opacity: 1;
    filter: contrast(.95);
    /* Ne asigurăm că este poziționat în spate și nu încurcă interacțiunea */
    z-index: 0;
    pointer-events: none;
    /* Fading discret când apare widget-ul peste el (opțional) */
    transition: opacity 0.5s ease-in-out;
}

/* 3. Când widget-ul este vizibil, putem ascunde sau estompa și mai mult logoul din spate */
.template-content-layout-wrapper.hero-out-of-view .sidebar-lead-form-column::before {
    opacity: 0; /* Schimbă la 0.03 dacă vrei să se mai vadă foarte puțin și în spatele cardului */
}

/*/////////////////*/

.sf_lead_gen_entry.card.hero-card {
    background: #F3F2F1;
}

.sidebar-form-card .sf_lead_gen_entry,
.sidebar-form-card .hio-theme .desktop\:border-radius-left-none,
.sf_lead_gen_entry.card.hero-card {
    border: 1px solid #a9afb8 !important;
    border-radius: 16px !important;
    border-left: 1px solid #a9afb8 !important;
    border-top-left-radius: 16px !important;
    border-bottom-left-radius: 16px !important;
}
.template-content-layout-wrapper .sidebar-form-card {
    background: transparent;
    border-radius: unset;
    box-shadow: unset;
    border: unset !important;
}

/*//footer cta*/
.sf_lead_gen_entry__footer_container {
    margin: 60px auto 0;
    position: relative;
    gap: 0 !important;
}
.sf_lead_gen_entry__footer_container::before {
    content: "";
    display: block;
    width: 100%;
    height: 8px;
    background: linear-gradient(
            to right,
            #F36523 0 8.333%,
            #365B78 8.333% 38.889%,
            #DEECFF 38.889% 69.444%,
            #1C394F 69.444% 100%
    );
}
.sf_lead_gen_entry.footer.card {
    margin: 60px 0 40px;
    max-width: 1140px;
}

.sf_lead_gen_entry__footer_container .footer .content {
    display: flex;
    flex-direction: column;
    align-items: flex-start !important;
    justify-content: center;
    gap: 0 !important;
    padding: 32px 64px 32px 40px !important;
    flex: 1 1 512px;
}

.sf_lead_gen_entry__footer_container .footer .image img {
    display: flex;
    min-height: 467px;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center center;
    flex: 1 1 100%;
}

.sf_lead_gen_entry__footer_container .footer .content h2 {
    color: #1C394F;
    font-size: 36px;
    font-family: 'Encode Sans Semi Condensed', serif;
    font-weight: 600;
    line-height: 45px;
    letter-spacing: 0.18px;
    word-wrap: break-word;
    margin-bottom: 1rem !important;
}

.sf_lead_gen_entry__footer_container .footer .content p {
    font-size: 20px;
    color: #4F4F4F;
    font-family: 'Encode Sans Semi Condensed', serif;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: 0.60px;
    word-wrap: break-word;
    margin-block-start: unset;
    margin-block-end: unset;
    margin-bottom: 1.5rem !important;
}

.sf_lead_gen_entry__footer_container .footer .content ul.benefits {
    display: none !important;
}

h2.font-weight-semibold.text-slate-blue-deep,
h6.text-slate-blue-deep {
    text-align: left!important;
}

.sf_lead_gen_entry.footer.card {
    border-left: 1px solid #a9afb8 !important;
}

.sf_lead_gen_entry .content .benefits li {
    font-weight: 500 !important;
    color: #1C394F !important;
}

.hio-theme h2.font-weight-semibold.text-slate-blue-deep,
.section.main article .hio-theme h2.font-weight-semibold.text-slate-blue-deep {
    font-family: "Encode Sans Semi Condensed", sans-serif;
    font-weight: 600 !important;
    color: #1C394F !important;
    font-size: 32px !important;
    line-height: 40px !important;
    letter-spacing: 0.64px !important;
    word-wrap: break-word !important;
    margin-bottom: 20px !important;
}

.hio-theme .left-content {
    align-self: stretch !important;
}

@media only screen and (max-width: 1024px) {
    body[class*=tmp-blog-faq-gloassary] .copy-section-content {
        width: auto !important;
        margin: unset !important;
    }
}

.hio-theme p.small-text,
.hio-theme p.small-text a {
    margin-top: 16px !important;
    color: #1A73E8 !important;
    font-size: 18px !important;
    font-family: "Encode Sans Semi Condensed", sans-serif !important;
    font-weight: 600 !important;
    line-height: 22.50px !important;
    letter-spacing: 0.54px !important;
    word-wrap: break-word !important;
}
@media only screen and (max-width: 1024px) {
    .hio-theme p.small-text {
        margin-top: 8px !important;
    }
}