.t3-header {
    position: sticky;
    top: 0;
    z-index: 100;
    height: calc(var(--t3-header-h) + var(--t3-safe-top));
    padding-top: var(--t3-safe-top);
    transition: var(--t3-transition);
}

.t3-header.is-scrolled {
    backdrop-filter: blur(16px);
    background: var(--t3-overlay-strong);
    border-bottom: 1px solid var(--t3-border);
    box-shadow: 0 4px 24px var(--t3-shadow-color);
}

.t3-header__inner {
    width: min(1180px, calc(100% - (var(--t3-container-pad) * 2)));
    margin-inline: auto;
    height: var(--t3-header-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.t3-brand {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    flex: 1;
}

.t3-brand__logo {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--t3-accent-border);
    flex-shrink: 0;
    box-shadow: 0 4px 16px var(--t3-accent-glow);
}

.t3-brand__text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.t3-brand__name {
    font-weight: 900;
    font-size: 1rem;
    color: var(--t3-accent-2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.t3-brand__slogan {
    font-size: 0.75rem;
    color: var(--t3-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.t3-header__badge {
    display: none;
    padding: 0.3rem 0.75rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--t3-leaf);
    background: var(--t3-leaf-soft);
    border: 1px solid color-mix(in srgb, var(--t3-leaf) 30%, transparent);
}

.t3-nav-backdrop { display: none; }

.t3-nav-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: var(--t3-touch-min);
    height: var(--t3-touch-min);
    flex-shrink: 0;
    padding: 0;
    border: 1px solid var(--t3-border);
    border-radius: 50%;
    background: white;
    cursor: pointer;
}

.t3-nav-toggle span {
    display: block;
    width: 18px;
    height: 2px;
    margin-inline: auto;
    background: var(--t3-accent);
    border-radius: 2px;
    transition: var(--t3-transition);
}

.t3-nav {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.t3-nav__link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--t3-touch-min);
    padding: 0.55rem 1rem;
    border-radius: 999px;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--t3-text-muted);
    transition: var(--t3-transition);
}

.t3-nav__link:hover,
.t3-nav__link.is-active {
    color: var(--t3-accent-2);
    background: var(--t3-accent-soft);
}

.t3-nav__link.is-active {
    box-shadow: inset 0 0 0 1px var(--t3-accent-border);
}

.t3-nav__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 1.1rem;
    margin-inline-start: 0.5rem;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 700;
    background: linear-gradient(135deg, var(--t3-accent), var(--t3-accent-2));
    color: var(--t3-text-on-accent);
    box-shadow: 0 4px 16px var(--t3-accent-glow);
}

@media (min-width: 769px) {
    .t3-header__badge { display: inline-flex; }
}

@media (max-width: 768px) {
    .t3-nav-toggle { display: flex; }

    .t3-nav-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 98;
        background: var(--t3-backdrop);
        backdrop-filter: blur(4px);
    }

    .t3-nav-backdrop[hidden] { display: none; }

    .t3-nav {
        position: fixed;
        top: calc(var(--t3-header-h) + var(--t3-safe-top) + 0.5rem);
        inset-inline: var(--t3-container-pad);
        max-height: calc(100dvh - var(--t3-header-h) - var(--t3-safe-top) - var(--t3-safe-bottom) - 1rem);
        overflow-y: auto;
        flex-direction: column;
        align-items: stretch;
        padding: 0.75rem;
        border-radius: var(--t3-radius);
        background: var(--t3-overlay-nav);
        border: 1px solid var(--t3-border);
        box-shadow: var(--t3-shadow);
        z-index: 99;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-8px);
        transition: var(--t3-transition);
    }

    .t3-nav.is-open {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .t3-nav__link { width: 100%; font-size: 1rem; }

    .t3-nav__cta {
        margin-inline-start: 0;
        justify-content: center;
        min-height: var(--t3-touch-min);
    }

    .t3-brand__logo { width: 42px; height: 42px; }
    .t3-brand__name { font-size: 0.92rem; }
    .t3-brand__slogan { display: none; }
}
