/* Trinity IG — Header + Nav */
:root {
    --tri-primary: #1B3A6B;
    --tri-accent:  #0D9488;
}

.trinity-shell { font-family: inherit; }

/* Top bar */
.trinity-topbar { background: #0F2547; color: #BFD1EC; font-size: .9rem; }
.trinity-topbar-inner {
    max-width: 1200px; margin: 0 auto; padding: 8px 24px;
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
}
.trinity-topbar-left, .trinity-topbar-right { display: flex; align-items: center; gap: 16px; }
.trinity-topbar-link { color: #BFD1EC; text-decoration: none; }
.trinity-topbar-link:hover { color: #fff; }
.trinity-topbar-cta {
    background: var(--tri-accent); color: #fff; padding: 6px 14px; border-radius: 6px;
    text-decoration: none; font-weight: 600;
}
.trinity-topbar-cta:hover { background: #0b7a6f; color: #fff; }

/* Main nav */
.trinity-nav { background: #fff; border-bottom: 1px solid #E5E7EB; box-shadow: 0 2px 4px rgba(0,0,0,.04); }
.sticky-nav  { position: sticky; top: 0; z-index: 100; }
.trinity-nav-inner {
    max-width: 1200px; margin: 0 auto; padding: 14px 24px;
    display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.trinity-brand { text-decoration: none; display: inline-flex; align-items: center; }
.trinity-brand-text { font-weight: 700; color: var(--tri-primary); font-size: 1.15rem; }
.trinity-brand img, .custom-logo { max-height: 48px; width: auto; }

/* Menu */
.trinity-menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; }
.trinity-menu > li { position: relative; }
.trinity-menu a {
    display: block; padding: 10px 14px; text-decoration: none;
    color: var(--tri-primary); font-weight: 500; border-radius: 6px;
}
.trinity-menu > li > a:hover,
.trinity-menu > li.menu-item-has-children:hover > a { background: #F1F5FB; color: var(--tri-primary); }

/* Submenus — hover on desktop */
.trinity-menu .sub-menu {
    list-style: none; margin: 0; padding: 8px;
    position: absolute; top: 100%; left: 0; min-width: 240px;
    background: #fff; border: 1px solid #E5E7EB; border-radius: 8px;
    box-shadow: 0 10px 24px rgba(27,58,107,.12);
    opacity: 0; visibility: hidden; transform: translateY(4px);
    transition: opacity .15s ease, transform .15s ease, visibility .15s;
    z-index: 200;
}
.trinity-menu li.menu-item-has-children:hover > .sub-menu,
.trinity-menu li.menu-item-has-children:focus-within > .sub-menu,
.trinity-menu li.menu-item-has-children.is-open > .sub-menu {
    opacity: 1; visibility: visible; transform: translateY(0);
}
.trinity-menu .sub-menu a { padding: 8px 12px; font-weight: 400; white-space: nowrap; }
.trinity-menu .sub-menu a:hover { background: #F1F5FB; }

/* Dropdown caret */
.trinity-menu .menu-item-has-children > a::after {
    content: "\25BE"; margin-left: 6px; font-size: .7em; opacity: .7;
}

/* Contact CTA button (.tri-nav-cta class applied to Contact item) */
.trinity-menu > li.tri-nav-cta > a {
    background: var(--tri-accent); color: #fff;
    padding: 10px 18px; border-radius: 8px; font-weight: 600;
}
.trinity-menu > li.tri-nav-cta > a:hover { background: #0b7a6f; color: #fff; }

/* Hamburger */
.trinity-hamburger {
    display: none; background: transparent; border: 0; cursor: pointer;
    width: 40px; height: 40px; padding: 8px; flex-direction: column; gap: 5px; justify-content: center;
}
.trinity-hamburger span {
    display: block; height: 3px; background: var(--tri-primary); border-radius: 2px;
    transition: transform .2s, opacity .2s;
}
.trinity-hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.trinity-hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.trinity-hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* Mobile */
@media (max-width: 768px) {
    .trinity-topbar-inner { flex-direction: column; gap: 6px; font-size: .85rem; text-align: center; }
    .trinity-hamburger { display: flex; }
    .trinity-primary {
        display: none; position: absolute; top: 100%; left: 0; right: 0;
        background: #fff; border-top: 1px solid #E5E7EB;
        box-shadow: 0 10px 24px rgba(27,58,107,.12);
        max-height: calc(100vh - 100px); overflow-y: auto;
    }
    .trinity-primary.is-open { display: block; }
    .trinity-nav-inner { position: relative; flex-wrap: wrap; }
    .trinity-menu { flex-direction: column; align-items: stretch; padding: 12px; gap: 0; }
    .trinity-menu > li { width: 100%; }
    .trinity-menu > li > a { padding: 12px 14px; }
    .trinity-menu .sub-menu {
        position: static; opacity: 1; visibility: visible; transform: none;
        border: 0; box-shadow: none; padding: 0 0 0 16px; min-width: 0;
        display: none;
    }
    .trinity-menu li.menu-item-has-children.is-open > .sub-menu { display: block; }
    .trinity-menu .menu-item-has-children > a::after { float: right; transition: transform .2s; }
    .trinity-menu li.menu-item-has-children.is-open > a::after { transform: rotate(180deg); }
    .trinity-menu > li.tri-nav-cta > a { text-align: center; margin-top: 8px; }
}