/* Public navbar. Transparent at the top; a faint blue box fades in behind the same content once the visitor scrolls.
   Brand system: slate text, 6px item radius, blue only for state, no shadow. */
.lh-pnav { position: fixed; top: 0; left: 0; right: 0; z-index: 50; pointer-events: none; }
/* The bar never moves or resizes: content stays on a 1240px column (the footer and landing width) so it lines up with the text below.
   Scrolling only fades in a tinted box behind the same content. */
.lh-pnav__bar { pointer-events: auto; position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; max-width: 1240px; height: 4rem; margin: 0 auto; padding: 0 1rem; }
.lh-pnav__bar::before { content: ""; position: absolute; z-index: -1; inset: .375rem .25rem; border-radius: 10px; background: var(--lh-pnav-surface); box-shadow: 0 8px 20px -10px rgba(18, 35, 63, .28); opacity: 0; transition: opacity 220ms ease; }
.lh-pnav { --lh-pnav-surface: #dde9f8; --lh-pnav-line: rgba(36, 88, 166, .14); }
.lh-pnav.is-compact .lh-pnav__bar::before { opacity: 1; }
/* Faint hairline in the box color under the bar at the top of the page; it spans the floating box width and hands off to the box on scroll. */
.lh-pnav__bar::after { content: ""; position: absolute; left: .25rem; right: .25rem; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--lh-pnav-line) 4%, var(--lh-pnav-line) 96%, transparent); transition: opacity 220ms ease; pointer-events: none; }
.lh-pnav.is-compact .lh-pnav__bar::after { opacity: 0; }


.lh-pnav__brand { display: flex; align-items: center; flex: 0 0 auto; border-radius: 6px; }
.lh-pnav__logo { display: block; height: 2.75rem; width: auto; }

.lh-pnav__links, .lh-pnav__actions { display: none; align-items: center; gap: .4rem; }
.lh-pnav__mobile-actions { display: flex; align-items: center; gap: .5rem; }

.lh-pnav__item { display: inline-flex; align-items: center; gap: .3rem; padding: .6rem .95rem; border: 0; border-radius: 6px; background: transparent; color: var(--lh-slate-600, #475569); font: inherit; font-size: .9rem; line-height: 1.25rem; font-weight: 600; white-space: nowrap; text-decoration: none; cursor: pointer; transition: color 140ms ease, background-color 140ms ease; }
.lh-pnav__item:hover, .lh-pnav__menu.is-open > .lh-pnav__item, .lh-pnav__item[aria-current="page"] { color: var(--lh-navy, #12233f); background: var(--lh-slate-100, #f1f5f9); }
.lh-pnav__item[aria-current="page"] { color: var(--lh-navy, #12233f); }
.lh-pnav a:focus-visible, .lh-pnav button:focus-visible { outline: 2px solid rgba(36, 88, 166, .35); outline-offset: 2px; }
.lh-pnav__chevron { width: .95rem; height: .95rem; color: var(--lh-slate-400, #94a3b8); transition: transform 150ms ease; }
.lh-pnav__menu.is-open .lh-pnav__chevron { transform: rotate(180deg); }

/* Start Free: a quiet tint beside the hero's own primary action; fills on hover. */
.lh-pnav__start { display: inline-flex; align-items: center; justify-content: center; min-height: 2.5rem; padding: 0 1.2rem; border-radius: 6px; background: #e6eefa; color: var(--lh-navy, #12233f); font-size: .9rem; font-weight: 700; white-space: nowrap; text-decoration: none; transition: background-color 200ms ease, color 200ms ease; }
.lh-pnav__start:hover, .lh-pnav__start:focus-visible { background: var(--lh-navy, #12233f); color: #fff; }

/* Dropdown: one horizontal row of destinations, no heading. */
.lh-pnav__menu { position: relative; }
.lh-pnav__panel { position: absolute; top: 100%; left: 50%; z-index: 5; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .25rem; width: 46rem; max-width: calc(100vw - 2rem); margin-top: .4rem; padding: .4rem; transform: translateX(-50%); background: #fff; border: 1px solid var(--lh-slate-300, #cbd5e1); border-radius: var(--lh-radius-panel, .5rem); }
.lh-pnav__panel[hidden] { display: none; }
.lh-pnav__panel-link { display: block; padding: .7rem .8rem; border-radius: 6px; text-decoration: none; }
.lh-pnav__panel-link:hover, .lh-pnav__panel-link:focus-visible, .lh-pnav__panel-link[aria-current="page"] { background: var(--lh-slate-50, #f8fafc); }
.lh-pnav__panel-title { display: block; color: var(--lh-slate-900, #0f172a); font-size: .8125rem; line-height: 1.15rem; font-weight: 700; }
.lh-pnav__panel-link:hover .lh-pnav__panel-title { color: var(--lh-blue); }
.lh-pnav__panel-note { display: block; margin-top: .15rem; color: var(--lh-slate-500, #64748b); font-size: .6875rem; line-height: 1rem; }

/* Scrolled state: navy text on the pale blue box; the current page is a translucent white pill. */
.lh-pnav.is-compact .lh-pnav__item { color: var(--lh-navy, #12233f); }
.lh-pnav.is-compact .lh-pnav__item:hover, .lh-pnav.is-compact .lh-pnav__menu.is-open > .lh-pnav__item { background: rgba(255, 255, 255, .55); }
.lh-pnav.is-compact .lh-pnav__item[aria-current="page"] { background: rgba(255, 255, 255, .8); }
.lh-pnav.is-compact .lh-pnav__panel { background: var(--lh-pnav-surface); border-color: transparent; box-shadow: 0 10px 24px -12px rgba(18, 35, 63, .3); }
.lh-pnav.is-compact .lh-pnav__panel-link:hover, .lh-pnav.is-compact .lh-pnav__panel-link:focus-visible, .lh-pnav.is-compact .lh-pnav__panel-link[aria-current="page"] { background: rgba(255, 255, 255, .6); }
.lh-pnav.is-compact .lh-pnav__start { background: var(--lh-blue); color: #fff; }
.lh-pnav.is-compact .lh-pnav__start:hover, .lh-pnav.is-compact .lh-pnav__start:focus-visible { background: var(--lh-blue-hover); }

/* Mobile menu. */
.lh-pnav__burger { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border: 1px solid var(--lh-slate-300, #cbd5e1); border-radius: 6px; background: #fff; color: var(--lh-slate-600, #475569); cursor: pointer; }
.lh-pnav__burger svg { width: 1.25rem; height: 1.25rem; }
.lh-pnav__burger-close, .lh-pnav__burger[aria-expanded="true"] .lh-pnav__burger-open { display: none; }
.lh-pnav__burger[aria-expanded="true"] .lh-pnav__burger-close { display: inline; }
.lh-pnav__mobile { pointer-events: auto; max-width: 1240px; max-height: calc(100vh - 4rem); margin: 0 auto; padding: .5rem 1rem 1rem; overflow-y: auto; background: #fff; border-bottom: 1px solid var(--lh-slate-200, #e2e8f0); }
.lh-pnav__mobile[hidden] { display: none; }
.lh-pnav__mobile-group { padding: .5rem 0; border-bottom: 1px solid var(--lh-slate-100, #f1f5f9); }
.lh-pnav__mobile-group:last-child { border-bottom: 0; }
.lh-pnav__mobile-label { padding: .25rem .75rem; color: var(--lh-slate-500, #64748b); font-size: .625rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.lh-pnav__mobile a { display: block; padding: .55rem .75rem; border-radius: 6px; color: var(--lh-slate-700, #334155); font-size: .8125rem; font-weight: 600; text-decoration: none; }
.lh-pnav__mobile a:hover { background: var(--lh-slate-50, #f8fafc); }

@media (min-width: 640px) {
    .lh-pnav__bar { padding: 0 1.5rem; }
    .lh-pnav__bar::before { inset: .375rem .5rem; }
    .lh-pnav__bar::after { left: .5rem; right: .5rem; }
}
@media (min-width: 1100px) {
    .lh-pnav__bar { display: grid; grid-template-columns: 1fr auto 1fr; }
    .lh-pnav__links, .lh-pnav__actions { display: flex; }
    .lh-pnav__actions { justify-self: end; gap: .5rem; }
    .lh-pnav__mobile-actions, .lh-pnav__mobile { display: none; }
    .lh-pnav__brand { justify-self: start; }
}
@media (max-width: 1099px) {
    .lh-pnav__start { min-height: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
    .lh-pnav__bar::before, .lh-pnav__bar::after, .lh-pnav__chevron, .lh-pnav__item, .lh-pnav__start { transition: none; }
}