/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* Single slim masthead, content, footer. No sidebars, no sub-nav bands. */

.app-shell[b-a0mbfve0dk] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* --- Masthead: CCS blue band, sticky --------------------------- */

.masthead[b-a0mbfve0dk] {
    background: var(--ccs-blue);
    color: #FFFFFF;
    border-bottom: 4px solid var(--ccs-black);
    position: sticky;
    top: 0;
    z-index: 50;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.masthead-inner[b-a0mbfve0dk] {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0.55rem 1.75rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
}

.masthead-brand[b-a0mbfve0dk] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    border-bottom: none;
    color: #FFFFFF;
}
.masthead-brand:hover[b-a0mbfve0dk] { border-bottom: none; color: #FFFFFF; }

.cougar-mark[b-a0mbfve0dk] {
    display: inline-block;
    width: 52px;
    height: 52px;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(1px 1px 0 rgba(0,0,0,0.18));
    transition: transform 0.18s ease;
}
.masthead-brand:hover .cougar-mark[b-a0mbfve0dk] {
    transform: rotate(-3deg) scale(1.04);
}

.masthead-text[b-a0mbfve0dk] {
    display: inline-flex;
    flex-direction: column;
    line-height: 1;
}
.masthead-text .masthead-title[b-a0mbfve0dk] {
    font-family: var(--font-display);
    font-weight: 900;
    font-size: 1.75rem;
    letter-spacing: 0.02em;
    color: #FFFFFF;
    text-transform: uppercase;
    line-height: 0.95;
}
.masthead-text .masthead-sub[b-a0mbfve0dk] {
    font-family: var(--font-mono);
    font-size: 0.64rem;
    letter-spacing: 0.18em;
    color: rgba(255, 255, 255, 0.75);
    text-transform: uppercase;
    margin-top: 0.28rem;
}

.masthead-nav[b-a0mbfve0dk] {
    display: inline-flex;
    align-items: center;
}

/* --- Content ------------------------------------------------------------ */

.content-area[b-a0mbfve0dk] {
    flex: 1;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 2rem 1.75rem 3rem;
    outline: none;
}
.content-area:focus[b-a0mbfve0dk] { outline: none; }

/* --- Footer: tiny attribution line -------------------------------------- */

.appfoot[b-a0mbfve0dk] {
    border-top: 1px solid var(--line);
    background: var(--paper);
    padding: 0.85rem 1.75rem;
    color: var(--ink-faint);
}
.appfoot-inner[b-a0mbfve0dk] {
    max-width: 1280px;
    margin: 0 auto;
    font-family: var(--font-mono);
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}
.appfoot a[b-a0mbfve0dk] { color: var(--ink-soft); border-bottom: 1px solid var(--line); }
.appfoot a:hover[b-a0mbfve0dk] { color: var(--ink); border-bottom-color: var(--gold-500); }
.appfoot-sep[b-a0mbfve0dk] { color: var(--line-strong); }

@media (max-width: 720px) {
    .masthead-inner[b-a0mbfve0dk] { padding: 0.65rem 1rem; }
    .content-area[b-a0mbfve0dk] { padding: 1.25rem 1rem 2.5rem; }
    .appfoot[b-a0mbfve0dk] { padding: 0.7rem 1rem; }
    .masthead-text .masthead-title[b-a0mbfve0dk] { font-size: 1.35rem; }
    .masthead-text .masthead-sub[b-a0mbfve0dk] { display: none; }
    .cougar-mark[b-a0mbfve0dk] { width: 38px; height: 38px; }
    .masthead-brand[b-a0mbfve0dk] { gap: 0.55rem; }
}
@media (max-width: 480px) {
    /* On very narrow screens collapse the brand text entirely — the
       cougar mark + the nav links carry the identity. */
    .masthead-text[b-a0mbfve0dk] { display: none; }
}