/* Catalogue-only shell: original landing header/footer, without landing globals. */
.site-header,
.library-footer,
.library-site > .skip-link {
    --blue: #1769aa;
    --green: #45a867;
    --muted: #647587;
    --line: #dfe8ee;
    --font-title: "Manrope", sans-serif;
    color: #17324d;
    font-family: "DM Sans", sans-serif;
    line-height: 1.6;
}

.site-header *, .library-footer * { box-sizing: border-box; }
.site-header a, .library-footer a { color: inherit; text-decoration: none; }
.site-header .container, .library-footer .container {
    width: min(1180px, calc(100% - 40px));
    max-width: none;
    padding: 0;
    margin-inline: auto;
}

.library-site > .skip-link {
    position: absolute;
    left: -9999px;
    top: 10px;
    background: #fff;
    padding: 10px;
    z-index: 999;
}
.library-site > .skip-link:focus { left: 10px; }
.site-header {
    height: 82px;
    display: flex;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 30;
    background: rgba(255, 255, 255, .92);
    border-bottom: 1px solid rgba(223, 232, 238, .8);
    backdrop-filter: blur(14px);
}
.site-header .nav-wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.site-header .brand, .library-footer .brand { display: flex; align-items: center; gap: 11px; }
.site-header .brand-mark, .library-footer .brand-mark {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: var(--green);
}
.site-header .brand-mark svg, .library-footer .brand-mark svg {
    max-width: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.6;
    stroke-linejoin: round;
}
.site-header .brand strong, .library-footer .brand strong {
    display: block;
    font-family: var(--font-title);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: -.3px;
}
.site-header .brand small, .library-footer .brand small { display: block; color: var(--muted); font-size: 11px; }
.site-header nav { display: flex; gap: 30px; font-weight: 600; font-size: 14px; }
.site-header nav a:hover { color: var(--blue); }
.site-header .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    padding: 0 24px;
    border-radius: 12px;
    font-weight: 700;
    transition: .2s;
    border: 1px solid transparent;
    position: relative;
    overflow: hidden;
}
.site-header .button:hover { transform: translateY(-2px); }
.site-header .button-primary {
    background: linear-gradient(135deg, var(--green), #2c9e59);
    color: #fff;
    box-shadow: 0 9px 22px rgba(69, 168, 103, .22);
}
.site-header .button-small { min-height: 44px; padding-inline: 18px; font-size: 14px; }
.site-header .button:after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-115%);
    background: linear-gradient(110deg, transparent 20%, rgba(255, 255, 255, .23) 48%, transparent 76%);
    transition: transform 650ms ease;
    pointer-events: none;
}
.site-header .button:hover:after { transform: translateX(115%); }

.library-footer { padding: 35px 0; background: #fff; border-top: 1px solid var(--line); }
.library-footer .footer-grid { display: flex; justify-content: space-between; align-items: center; }
.library-footer .footer-grid p { margin: 1em 0; font-size: 11px; color: #8a99a4; }
.library-footer .footer-grid > div { display: flex; gap: 18px; font-size: 11px; color: var(--muted); }
.library-footer .footer-brand { transform: scale(.85); transform-origin: left center; }

@media (max-width: 1024px) {
    .site-header .container, .library-footer .container { width: min(100% - 28px, 1180px); }
    .library-footer .footer-grid { flex-direction: column; gap: 20px; text-align: center; }
    .library-footer .footer-brand { transform: none; }
}
@media (max-width: 1000px) {
    .site-header nav { display: none; }
}
@media (max-width: 680px) {
    .site-header { height: 70px; }
    .site-header .brand small { display: none; }
}
@media (max-width: 440px) {
    .site-header .brand strong { font-size: 13px; }
    .site-header .brand-mark, .library-footer .brand-mark { width: 35px; }
}
@media (prefers-reduced-motion: reduce) {
    .site-header .button:after { display: none; }
}