/*
 * Cabeçalho institucional das páginas autenticadas.
 *
 * A geometria desktop replica o hero aprovado da Agenda. As adaptações
 * específicas de cada módulo permanecem livres no mobile.
 */
@media (min-width: 768px) {
    .app-content .pcse-page-hero {
        --pcse-hero-accent: var(--bs-theme, #00ff9c);
        --pcse-hero-accent-rgb: var(--bs-theme-rgb, 0, 255, 156);
        position: relative;
        display: flex;
        width: 100%;
        min-width: 0;
        gap: 1rem;
        align-items: center;
        margin-bottom: 1.25rem;
        padding: 1.35rem 1.5rem;
        overflow: hidden;
        border: 1px solid rgba(var(--bs-white-rgb), 0.09);
        border-radius: 16px;
        background: linear-gradient(
            135deg,
            rgba(var(--pcse-hero-accent-rgb), 0.1),
            rgba(var(--bs-white-rgb), 0.02) 58%
        );
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .app-content .pcse-page-hero::before {
        position: absolute;
        z-index: 0;
        inset: 0 auto auto 0;
        display: block;
        width: 100%;
        height: 3px;
        content: "";
        background: linear-gradient(90deg, var(--pcse-hero-accent), transparent 75%);
        pointer-events: none;
    }

    .app-content .pcse-page-hero::after {
        display: none;
        content: none;
    }

    .app-content .pcse-page-hero > * {
        position: relative;
        z-index: 1;
    }

    .app-content .pcse-page-hero :where(
        [class*="hero__icon"],
        [class*="hero-icon"]
    ) {
        display: inline-grid;
        flex: 0 0 54px;
        width: 54px;
        height: 54px;
        place-items: center;
        padding: 0;
        color: var(--pcse-hero-accent);
        border: 1px solid rgba(var(--pcse-hero-accent-rgb), 0.34);
        border-radius: 14px;
        background: rgba(var(--pcse-hero-accent-rgb), 0.11);
        box-shadow: none;
    }

    .app-content .pcse-page-hero :where(
        [class*="hero__icon"],
        [class*="hero-icon"]
    ) :where(iconify-icon, i) {
        margin: 0;
        color: currentColor;
        font-size: 1.7rem;
        line-height: 1;
    }

    .app-content .pcse-page-hero :where(
        [class*="hero__copy"],
        [class*="hero-copy"],
        [class*="hero__content"],
        [class*="hero-content"],
        [class*="hero-main"]
    ),
    .app-content .pcse-page-hero > :has(h1) {
        flex: 1 1 auto;
        min-width: 0;
    }

    .app-content .pcse-page-hero :where(
        [class*="hero__kicker"],
        [class*="hero-kicker"],
        [class*="hero__eyebrow"],
        [class*="hero-eyebrow"],
        [class*="kicker"],
        [class*="eyebrow"]
    ) {
        display: inline-flex;
        gap: 0.35rem;
        align-items: center;
        margin: 0;
        color: var(--pcse-hero-accent);
        font-size: 0.67rem;
        font-weight: 700;
        letter-spacing: 0.14em;
        line-height: 1.5;
        text-transform: uppercase;
    }

    .app-content .pcse-page-hero h1 {
        margin: 0.12rem 0 0;
        color: rgba(var(--bs-white-rgb), 0.94);
        font-size: 1.35rem;
        font-weight: 500;
        letter-spacing: normal;
        line-height: 1.25;
    }

    .app-content .pcse-page-hero :where(
        [class*="hero__copy"],
        [class*="hero-copy"],
        [class*="hero__content"],
        [class*="hero-content"],
        [class*="hero-main"]
    ) > p,
    .app-content .pcse-page-hero > :has(h1) > p,
    .app-content .pcse-page-hero :where(
        [class*="hero__description"],
        [class*="hero-description"],
        [class*="hero__subtitle"],
        [class*="hero-subtitle"]
    ) {
        display: block;
        max-width: 48rem;
        margin: 0.28rem 0 0;
        color: rgba(var(--bs-white-rgb), 0.62);
        font-size: 0.82rem;
        line-height: 1.5;
    }

    .app-content .pcse-page-hero :where(
        [class*="hero__actions"],
        [class*="hero-actions"],
        [class*="hero__action"],
        [class*="hero-action"],
        [class*="hero__acoes"],
        [class*="hero__acao"]
    ) {
        display: flex;
        flex: 0 0 auto;
        gap: 0.4rem;
        align-items: center;
        margin-left: auto;
    }

    .app-content .pcse-page-hero :where(
        [class*="hero__actions"],
        [class*="hero-actions"],
        [class*="hero__action"],
        [class*="hero-action"],
        [class*="hero__acoes"],
        [class*="hero__acao"]
    ) .btn {
        display: inline-flex;
        width: auto;
        min-width: 0;
        min-height: 0;
        height: auto;
        gap: 0.35rem;
        align-items: center;
        justify-content: center;
        padding: 0.35rem 0.625rem;
        border-radius: 0;
        font-size: 0.75rem;
        font-weight: 400;
        letter-spacing: normal;
        line-height: 1.5;
        box-shadow: none;
        transform: none;
    }
}