/* Phone/email strip pinned to the top edge of the fixed .navbar box.
   Positioned absolutely so it sits outside .navbar's own flex layout —
   .navbar's padding is rebalanced (more on top, less on bottom, same total)
   so the navbar's overall height is unchanged and no page template's own
   "clear the fixed nav" padding-top needs to change. Hidden once .sticky is
   applied (scrolled state) so the compact scrolled nav is untouched.

   Fully self-contained styling (no reuse of .contact-link) — an earlier
   version borrowed .contact-link's color rules, which flip to dark text on
   .navbar:hover and on several page types. That logic existed for
   .contact-link's own transparent background and fought this strip's fixed
   dark background (needed !important battles to fix), so this is a clean
   rebuild instead of another patch. */

.navbar {
    padding: 30px 0 10px;
}

.navbar.sticky {
    padding: 15px 0;
}

.topline {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 22px;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    padding: 0 48px;
    background: var(--primary-turkish-coffee);
}

/* Desktop only (matches this header's other d-lg-flex elements), and hidden
   again once .sticky is applied on scroll. Handled here rather than with
   Bootstrap's d-none/d-lg-flex utilities because those carry !important and
   would beat the .sticky override below. */
@media (min-width: 992px) {
    .topline {
        display: flex;
    }

    .navbar.sticky .topline {
        display: none;
    }
}

.topline-divider {
    width: 1px;
    height: 11px;
    background: rgba(255, 255, 255, .25);
}

.topline-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: rgba(255, 255, 255, .82);
    font-size: 12.5px;
    font-weight: 500;
    letter-spacing: .1px;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: color .18s ease;
}

.topline-link i {
    font-size: 11px;
    color: var(--primary-yellow, #FDB72A);
    transition: transform .18s ease;
}

.topline-link:hover,
.topline-link:focus-visible {
    color: #fff;
    text-decoration: none;
}

.topline-link:hover i,
.topline-link:focus-visible i {
    transform: scale(1.1);
}

.topline-link:focus-visible {
    outline: 2px solid var(--primary-yellow, #FDB72A);
    outline-offset: 3px;
    border-radius: 2px;
}