/* =========================================================
   HealPath Core Design System
   Load this file before healpath-site.css.
   Shared tokens, primitives, header and footer.
   ========================================================= */

/* =========================================================
   1. Design tokens
   ========================================================= */

:root,
.healpath-home {
    /* Brand */
    --hp-navy-950: #01013d;
    --hp-navy-900: #051549;
    --hp-navy-800: #0e245a;

    --hp-turquoise-500: #11afcb;
    --hp-turquoise-600: #079ab3;
    --hp-turquoise-100: #dff7fb;
    --hp-turquoise-50: #eefbfc;

    /* Text */
    --hp-text: #071847;
    --hp-muted: #667085;
    --hp-muted-light: #98a2b3;

    /* Surfaces */
    --hp-white: #ffffff;
    --hp-surface: #ffffff;
    --hp-surface-soft: #f3f8fb;
    --hp-surface-blue: #edf6fd;

    /* Borders */
    --hp-border: #e0e7ef;
    --hp-border-dark: rgba(255, 255, 255, 0.12);

    /* Status */
    --hp-success: #2fb36d;

    /* Layout */
    --hp-container-width: 1320px;
    --hp-container-wide: 1440px;
    --hp-container-gutter: clamp(20px, 3vw, 40px);

    /* Spacing */
    --hp-section-padding-y: clamp(64px, 5vw, 80px);
    --hp-grid-gap: clamp(18px, 2vw, 28px);

    /* Radius */
    --hp-radius-sm: 10px;
    --hp-radius-md: 16px;
    --hp-radius-lg: 24px;
    --hp-radius-xl: 32px;
    --hp-radius-pill: 999px;

    /* Shadows */
    --hp-shadow-sm: 0 6px 18px rgba(5, 21, 73, 0.06);
    --hp-shadow-card: 0 12px 30px rgba(5, 21, 73, 0.08);
    --hp-shadow-hover: 0 18px 42px rgba(5, 21, 73, 0.13);
    --hp-shadow-floating: 0 10px 28px rgba(5, 21, 73, 0.16);

    /* Shared card icons */
    --hp-card-icon-size: 52px;
    --hp-card-icon-font-size: 18px;
}


/* =========================================================
   2. Base layout
   ========================================================= */

.healpath-home .hp-section {
    position: relative;

    margin-block: 0 !important;
    padding-top: var(--hp-section-padding-y) !important;
    padding-bottom: var(--hp-section-padding-y) !important;
}

/*
 * Inner heading components must not introduce another layer
 * of section-level vertical padding.
 */
.healpath-home .hp-section .hp-section-header,
.healpath-home .hp-section .hp-service-panel__header {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.healpath-home .hp-section--white {
    background-color: var(--hp-white);
}

.healpath-home .hp-container {
    width: min(
        var(--hp-container-width),
        calc(100% - (var(--hp-container-gutter) * 2))
    );
    margin-inline: auto;
}


/* =========================================================
   3. Section headings
   ========================================================= */

.healpath-home .hp-section-header {
    max-width: 820px;
    margin-bottom: clamp(32px, 4vw, 52px);
}

.healpath-home .hp-section-header--center {
    margin-inline: auto;
    text-align: center;
}

.healpath-home .hp-eyebrow-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 14px;
    padding: 0;
    line-height: 1;
}

.healpath-home .hp-eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    min-height: 36px;
    margin: 0;
    padding: 0 18px;

    border-radius: var(--hp-radius-pill);

    color: var(--hp-white);
    background-color: var(--hp-turquoise-500);

    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.055em;
    text-transform: uppercase;
    white-space: nowrap;

    box-shadow: 0 8px 18px rgba(17, 175, 203, 0.18);
}

.healpath-home .hp-eyebrow i {
    display: grid;
    width: 14px;
    height: 14px;
    place-items: center;
    flex: 0 0 14px;

    margin: 0;
    padding: 0;

    font-size: 12px;
    line-height: 1;
}

.healpath-home .hp-eyebrow__text {
    display: block;
    margin: 0;
    padding: 0;

    font: inherit;
    line-height: 1;

    /* Optical correction for the current font metrics */
    transform: translateY(-0.5px);
}

.healpath-home .hp-title {
    margin: 0 0 14px;

    color: var(--hp-text);

    font-size: clamp(34px, 3.4vw, 52px);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -0.025em;
}

.healpath-home .hp-lead {
    max-width: 700px;
    margin: 0 auto;

    color: var(--hp-muted);

    font-size: clamp(15px, 1.3vw, 18px);
    line-height: 1.7;
}


/* =========================================================
   4. Grid system
   ========================================================= */

.healpath-home .hp-grid {
    display: grid;
    align-items: stretch;
    gap: var(--hp-grid-gap);
}

.healpath-home .hp-grid--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}


/* =========================================================
   5. Shared card system
   ========================================================= */

.healpath-home .hp-card {
    position: relative;

    display: flex;
    min-width: 0;
    height: 100%;
    flex-direction: column;

    overflow: hidden;

    border: 1px solid var(--hp-border);
    border-radius: var(--hp-radius-md);

    background-color: var(--hp-surface);
    box-shadow: var(--hp-shadow-card);

    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        border-color 180ms ease;
}

.healpath-home .hp-card:hover {
    transform: translateY(-4px);
    border-color: rgba(17, 175, 203, 0.28);
    box-shadow: var(--hp-shadow-hover);
}

.healpath-home .hp-card__media {
    position: relative;
    flex: 0 0 auto;
    overflow: hidden;
}

.healpath-home .hp-card__media img {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;

    object-fit: cover;
    object-position: center;
}

.healpath-home .hp-card__icon {
    display: grid;
    box-sizing: border-box;
    width: var(--hp-card-icon-size);
    height: var(--hp-card-icon-size);
    place-items: center;

    color: var(--hp-white);
    background-color: var(--hp-turquoise-500);

    font-size: var(--hp-card-icon-font-size);
    line-height: 1;

    box-shadow: var(--hp-shadow-floating);
}

.healpath-home .hp-card__body {
    display: flex;
    height: 100%;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 24px;
}

.healpath-home .hp-card__title {
    margin: 0 0 12px;

    color: var(--hp-text);

    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
}

.healpath-home .hp-card__text {
    margin: 0 0 22px;

    color: var(--hp-muted);

    font-size: 14px;
    line-height: 1.7;
}

.healpath-home .hp-card__link {
    margin-top: auto;
}


/* =========================================================
   6. Links
   ========================================================= */

.healpath-home .hp-link-arrow {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 8px;

    color: var(--hp-turquoise-600);

    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;

    transition:
        color 180ms ease,
        gap 180ms ease;
}

.healpath-home .hp-link-arrow::after {
    content: "\2192";

    position: relative;
    top: -1px;

    display: inline-block;

    font-size: 17px;
    line-height: 1;

    transition: transform 180ms ease;
}

.healpath-home .hp-link-arrow:hover {
    gap: 11px;
    color: var(--hp-navy-800);
    text-decoration: none;
}

.healpath-home .hp-link-arrow:hover::after {
    transform: translateX(2px);
}

.healpath-home .hp-link-arrow:focus-visible {
    outline: 2px solid var(--hp-turquoise-500);
    outline-offset: 4px;
    border-radius: 3px;
}


/* =========================================================
   HealPath Footer
   ========================================================= */

#footer.footer-builder {
    position: relative;

    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;

    color: #ffffff;
    background-color: #030047;
}


/* =========================================================
   Footer main area
   ========================================================= */

#footer .hp-footer-main {
    position: relative;

    margin: 0 !important;
    padding: 52px 0 34px !important;

    background:
        linear-gradient(
            105deg,
            #030047 0%,
            #05004d 58%,
            #06105a 100%
        ) !important;
}

#footer .hp-footer-main > .porto-wrap-container {
    width: calc(100% - 40px);
    max-width: 1160px;

    margin: 0 auto !important;
    padding: 0 !important;
}

#footer .hp-footer-main > .porto-wrap-container > .row {
    display: grid !important;
    grid-template-columns:
        minmax(0, 1.18fr)
        minmax(0, 0.95fr)
        minmax(0, 1.15fr)
        minmax(0, 1fr);
    align-items: start;
    gap: clamp(38px, 4vw, 64px);

    margin: 0 !important;
    padding: 0 !important;
}


/* Override old WPBakery and footer responsive widths */

#footer
.hp-footer-main
> .porto-wrap-container
> .row
> .vc_column_container {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0;
    flex: none !important;

    margin: 0 !important;
    padding: 0 !important;
}

#footer .hp-footer-main .vc_column-inner,
#footer .hp-footer-main .wpb_wrapper,
#footer .hp-footer-main .wpb_content_element {
    margin-top: 0;
}

#footer .hp-footer-main .vc_column-inner {
    padding: 0 !important;
}


/* =========================================================
   Footer logo
   ========================================================= */

#footer .hp-footer-main .wpb_single_image {
    margin: 0 0 18px !important;
}

#footer .hp-footer-main .vc_single_image-wrapper {
    display: block;

    margin: 0 !important;
    padding: 0 !important;
}

#footer .hp-footer-main .vc_single_image-img {
    display: block;

    width: 100%;
    max-width: 240px;
    height: auto;

    margin: 0 !important;
}


/* =========================================================
   Footer headings
   ========================================================= */

#footer .hp-footer-main h4.vc_custom_heading,
#footer .hp-footer-main .wpb_heading {
    margin: 0 0 24px !important;
    padding: 0 !important;

    color: #ffffff !important;

    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase;
}


/* =========================================================
   Brand contact information
   ========================================================= */

#footer .footer-contact-info {
    margin: 0 !important;
    padding: 0 !important;
}

#footer .footer-contact-info p {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin: 0 0 12px !important;
    padding: 0 !important;

    color: rgba(255, 255, 255, 0.74) !important;

    font-size: 13px !important;
    line-height: 1.55 !important;
}

#footer .footer-contact-info p:last-child {
    margin-bottom: 0 !important;
}

#footer .footer-contact-info i {
    display: inline-flex;
    width: 17px;
    min-width: 17px;
    align-items: center;
    justify-content: center;

    margin: 3px 0 0 !important;

    color: #16c3dc !important;

    font-size: 14px !important;
    line-height: 1 !important;
}

#footer .footer-contact-info a {
    min-width: 0;

    color: rgba(255, 255, 255, 0.74) !important;

    text-decoration: none !important;
    overflow-wrap: anywhere;

    transition: color 0.2s ease;
}

#footer .footer-contact-info a:hover {
    color: #ffffff !important;
}


/* =========================================================
   Footer links
   ========================================================= */

#footer .footer-links-column {
    margin: 0 !important;
    padding: 0 !important;
}

#footer .footer-links-column ul {
    display: grid;
    gap: 11px;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}

#footer .footer-links-column li {
    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}

#footer .footer-links-column li::before,
#footer .footer-links-column li::after {
    content: none !important;
    display: none !important;
}

#footer .footer-links-column li a {
    display: inline-flex;
    min-width: 0;
    align-items: flex-start;
    gap: 10px;

    margin: 0 !important;
    padding: 0 !important;

    color: rgba(255, 255, 255, 0.72) !important;

    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
    text-decoration: none !important;

    transition:
        color 0.2s ease,
        transform 0.2s ease;
}

#footer .footer-links-column li a i {
    display: inline-flex;
    width: 16px;
    min-width: 16px;
    align-items: center;
    justify-content: center;

    margin: 2px 0 0 !important;

    color: #16c3dc !important;

    font-size: 13px !important;
    line-height: 1 !important;

    transition: transform 0.2s ease;
}

#footer .footer-links-column li a:hover {
    color: #ffffff !important;

    transform: translateX(3px);
}

#footer .footer-links-column li a:hover i {
    transform: scale(1.08);
}


/* =========================================================
   Contact and locations column
   ========================================================= */

#footer .footer-contact-details {
    margin: 0 !important;
    padding: 0 !important;
}

#footer .footer-contact-details .footer-subtitle {
    margin: 0 0 18px !important;
    padding: 0 !important;

    color: #16c3dc !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

#footer .footer-contact-details p:not(.footer-subtitle) {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin: 0 0 14px !important;
    padding: 0 !important;

    color: rgba(255, 255, 255, 0.78) !important;

    font-size: 13px !important;
    line-height: 1.55 !important;
}

#footer .footer-contact-details p:last-child {
    margin-bottom: 0 !important;
}

#footer .footer-contact-details i {
    display: inline-flex;
    width: 17px;
    min-width: 17px;
    align-items: center;
    justify-content: center;

    margin: 3px 0 0 !important;

    color: #16c3dc !important;

    font-size: 13px !important;
    line-height: 1 !important;
}


/* =========================================================
   Social icons
   ========================================================= */

#footer .footer-social-icons {
    display: flex !important;
    flex-wrap: wrap;
    gap: 10px;

    margin: 22px 0 0 !important;
    padding: 0 !important;
}

#footer .footer-social-icons a {
    display: inline-flex !important;
    width: 38px !important;
    height: 38px !important;
    align-items: center;
    justify-content: center;

    margin: 0 !important;
    padding: 0 !important;

    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 50% !important;

    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.09) !important;

    font-size: 14px !important;
    line-height: 1 !important;

    transition:
        color 0.2s ease,
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

#footer .footer-social-icons a:hover {
    border-color: rgba(22, 195, 220, 0.5) !important;

    color: #ffffff !important;
    background-color: rgba(22, 195, 220, 0.22) !important;

    transform: translateY(-2px);
}


/* =========================================================
   Footer bottom / Copyright
   ========================================================= */

#footer .hp-footer-bottom {
    margin: 0 !important;
    padding: 0 !important;

    background:
        linear-gradient(
            105deg,
            #030047 0%,
            #05004d 58%,
            #06105a 100%
        ) !important;
}

#footer .hp-footer-bottom > .porto-wrap-container {
    width: calc(100% - 40px);
    max-width: 1160px;

    margin: 0 auto !important;
    padding: 0 !important;
}

#footer .hp-footer-bottom .row {
    margin: 0 !important;
    padding: 0 !important;
}

#footer .hp-footer-bottom .vc_column_container {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 20px 0 24px !important;

    border-top: 1px solid rgba(255, 255, 255, 0.22) !important;
}

#footer .hp-footer-bottom .vc_column-inner {
    padding: 0 !important;
}

#footer .hp-footer-bottom h6 {
    margin: 0 !important;
    padding: 0 !important;

    color: rgba(255, 255, 255, 0.68) !important;

    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}


/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 991px) {

    #footer .hp-footer-main {
        padding: 46px 0 30px !important;
    }

    #footer .hp-footer-main > .porto-wrap-container > .row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 38px 52px;
    }

    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container {
        width: auto !important;
        max-width: none !important;
        flex: none !important;

        margin: 0 !important;
    }
}


/* =========================================================
   Footer — final mobile layout
   Balanced, readable and compact without squeezing columns.
   ========================================================= */

@media (max-width: 767px) {

    #footer.footer-builder {
        overflow: hidden !important;
    }

    #footer .hp-footer-main {
        padding: 28px 0 18px !important;
    }

    #footer .hp-footer-main > .porto-wrap-container,
    #footer .hp-footer-bottom > .porto-wrap-container {
        width: calc(100% - 32px) !important;
        max-width: 430px !important;
    }

    /* One clear mobile column */
    #footer .hp-footer-main > .porto-wrap-container > .row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 14px !important;

        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container {
        grid-column: 1 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    /* Preserve a natural reading order */
    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container:nth-child(1) {
        order: 1 !important;
    }

    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container:nth-child(2) {
        order: 2 !important;
    }

    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container:nth-child(3) {
        order: 3 !important;
    }

    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container:nth-child(4) {
        order: 4 !important;
    }

    /* Soft panel treatment for every footer block */
    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container
    > .vc_column-inner {
        width: 100% !important;
        padding: 18px !important;

        border: 1px solid rgba(255, 255, 255, 0.09) !important;
        border-radius: 16px !important;

        background: rgba(255, 255, 255, 0.045) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.025) !important;
    }

    /* Brand block */
    #footer .hp-footer-main .wpb_single_image {
        margin: 0 0 14px !important;
    }

    #footer .hp-footer-main .vc_single_image-img {
        width: auto !important;
        max-width: 185px !important;
        height: auto !important;
    }

    #footer .footer-contact-info {
        display: grid !important;
        gap: 7px !important;
    }

    #footer .footer-contact-info p {
        gap: 9px !important;

        margin: 0 !important;

        font-size: 12.5px !important;
        line-height: 1.45 !important;
    }

    #footer .footer-contact-info i {
        width: 16px !important;
        min-width: 16px !important;

        margin-top: 2px !important;

        font-size: 12px !important;
    }

    #footer .footer-social-icons {
        gap: 8px !important;

        margin: 15px 0 0 !important;
    }

    #footer .footer-social-icons a {
        width: 36px !important;
        height: 36px !important;

        font-size: 13px !important;
    }

    /* Headings */
    #footer .hp-footer-main h4.vc_custom_heading,
    #footer .hp-footer-main .wpb_heading {
        position: relative;

        margin: 0 0 14px !important;
        padding: 0 0 11px !important;

        font-size: 13px !important;
        line-height: 1.3 !important;
    }

    #footer .hp-footer-main h4.vc_custom_heading::after,
    #footer .hp-footer-main .wpb_heading::after {
        content: "";

        position: absolute;
        bottom: 0;
        left: 0;

        width: 34px;
        height: 2px;

        border-radius: 999px;

        background: #16c3dc;
    }

    /* Main menu and services use two readable columns */
    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container:nth-child(2)
    .footer-links-column ul,
    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container:nth-child(3)
    .footer-links-column ul {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        column-gap: 16px !important;
        row-gap: 10px !important;

        width: 100% !important;
    }

    #footer .footer-links-column li a {
        width: 100% !important;
        gap: 8px !important;

        font-size: 12px !important;
        line-height: 1.4 !important;
    }

    #footer .footer-links-column li a i {
        width: 14px !important;
        min-width: 14px !important;

        margin-top: 2px !important;

        font-size: 11px !important;
    }

    /* Contact block remains full-width and comfortable */
    #footer .footer-contact-details .footer-subtitle {
        margin: 0 0 11px !important;

        font-size: 12px !important;
    }

    #footer .footer-contact-details p:not(.footer-subtitle) {
        gap: 8px !important;

        margin: 0 0 9px !important;

        font-size: 12px !important;
        line-height: 1.45 !important;
    }

    #footer .footer-contact-details p:last-child {
        margin-bottom: 0 !important;
    }

    #footer .footer-contact-details i {
        width: 15px !important;
        min-width: 15px !important;

        margin-top: 2px !important;

        font-size: 11px !important;
    }

    /* Copyright */
    #footer .hp-footer-bottom .vc_column_container {
        padding: 16px 0 18px !important;
    }

    #footer .hp-footer-bottom h6 {
        font-size: 11px !important;
        line-height: 1.45 !important;
    }
}


/* Keep two-column link lists usable on very narrow devices */
@media (max-width: 360px) {

    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container:nth-child(2)
    .footer-links-column ul,
    #footer
    .hp-footer-main
    > .porto-wrap-container
    > .row
    > .vc_column_container:nth-child(3)
    .footer-links-column ul {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}


/* =========================================================
   Header top bar — mobile layout
   Compact single-row contact bar for the Porto header.
   ========================================================= */

@media (max-width: 767px) {

    /* Top bar shell */
    .header-wrapper .custom-header-top {
        min-height: 36px !important;

        margin: 0 !important;
        padding: 0 !important;

        background:
            linear-gradient(
                90deg,
                #01013d 0%,
                #071c5d 100%
            ) !important;
    }

    .header-wrapper
    .custom-header-top
    > .porto-wrap-container.container {
        width: calc(100% - 28px) !important;
        max-width: none !important;

        margin-inline: auto !important;
        padding: 0 !important;
    }

    .header-wrapper
    .custom-header-top
    > .porto-wrap-container.container
    > .row {
        display: flex !important;
        min-height: 36px !important;
        align-items: center !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    /* Contact column */
    .header-wrapper
    .custom-header-top
    .vc_column_container.flex-auto {
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 auto !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .header-wrapper
    .custom-header-top
    .vc_column_container.flex-auto
    > .vc_column-inner {
        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .header-wrapper
    .custom-header-top
    .vc_column_container.flex-auto
    > .vc_column-inner
    > .wpb_wrapper {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        align-items: center !important;
        gap: 11px !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    /* Contact links */
    .header-wrapper
    .custom-header-top
    .porto-sicon-box-link {
        display: inline-flex !important;
        width: auto !important;
        min-width: 0 !important;
        flex: 0 1 auto !important;
        align-items: center !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #ffffff !important;
        text-decoration: none !important;
    }

    /* Divider before email */
    .header-wrapper
    .custom-header-top
    .porto-sicon-box-link + .porto-sicon-box-link {
        position: relative;

        flex: 1 1 auto !important;

        padding-left: 11px !important;
    }

    .header-wrapper
    .custom-header-top
    .porto-sicon-box-link + .porto-sicon-box-link::before {
        content: "";

        position: absolute;
        top: 50%;
        left: 0;

        width: 1px;
        height: 16px;

        background: rgba(255, 255, 255, 0.24);

        transform: translateY(-50%);
    }

    /* Porto icon box */
    .header-wrapper
    .custom-header-top
    .porto-sicon-box {
        display: inline-flex !important;
        width: auto !important;
        min-width: 0 !important;
        align-items: center !important;
        gap: 6px !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .header-wrapper
    .custom-header-top
    .porto-sicon-default {
        display: block !important;
        flex: 0 0 auto !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .header-wrapper
    .custom-header-top
    .porto-just-icon-wrapper {
        display: grid !important;
        width: 16px !important;
        height: 16px !important;
        place-items: center !important;

        margin: 0 !important;
        padding: 0 !important;

        font-size: 14px !important;
        line-height: 1 !important;
    }

    .header-wrapper
    .custom-header-top
    .whatsapp-icon
    .porto-just-icon-wrapper {
        color: #35d06f !important;
    }

    .header-wrapper
    .custom-header-top
    .porto-sicon-header {
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .header-wrapper
    .custom-header-top
    .porto-sicon-title {
        display: block !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;

        color: #ffffff !important;

        font-size: 11.5px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        letter-spacing: 0 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    /* Keep the social column hidden on mobile */
    .header-wrapper
    .custom-header-top
    .vc_column_container.d-lg-block.d-none {
        display: none !important;
    }
}


/* Extra-tight phones */
@media (max-width: 360px) {

    .header-wrapper
    .custom-header-top
    > .porto-wrap-container.container {
        width: calc(100% - 20px) !important;
    }

    .header-wrapper
    .custom-header-top
    .vc_column_container.flex-auto
    > .vc_column-inner
    > .wpb_wrapper {
        gap: 8px !important;
    }

    .header-wrapper
    .custom-header-top
    .porto-sicon-box-link + .porto-sicon-box-link {
        padding-left: 8px !important;
    }

    .header-wrapper
    .custom-header-top
    .porto-sicon-title {
        font-size: 10.5px !important;
    }

    .header-wrapper
    .custom-header-top
    .porto-just-icon-wrapper {
        width: 14px !important;
        height: 14px !important;

        font-size: 12px !important;
    }
}

/* =========================================================
   Header top bar — full-width mobile fix
   ========================================================= */

@media (max-width: 767px) {

    .header-wrapper .custom-header-top {
        width: 100vw !important;
        max-width: none !important;

        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
    }

    .header-wrapper
    .custom-header-top
    > .porto-wrap-container.container {
        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding-inline: 14px !important;
    }

    .header-wrapper
    .custom-header-top
    > .porto-wrap-container.container
    > .row {
        width: 100% !important;
    }
}