html, body { height: 100%; }
body { display: flex; flex-direction: column; }
main { flex: 1 0 auto; }
footer { flex-shrink: 0; }
.hero { padding: 3rem 1rem; }
@media (min-width: 768px) { .hero { padding: 4rem 2rem; } }
.work-hero { width: 100%; max-width: none; height: auto; }

/* Compact/kiosk variant */
.navbar.navbar-dark.bg-dark { transition: all .15s ease-in-out; }

/* Kiosk mode: always compact */
.kiosk .navbar.navbar-dark.bg-dark { padding-top: .25rem; padding-bottom: .25rem; }
.kiosk .navbar-brand { font-size: 1rem; }
.kiosk .navbar .form-control,
.kiosk .navbar form[role="search"] { display: none !important; }
.kiosk .navbar .btn-outline-light { padding: .25rem .5rem; font-size: .875rem; }

/* Small screens: compact */
@media (max-width: 576px) {
.navbar.navbar-dark.bg-dark { padding-top: .25rem; padding-bottom: .25rem; }
.navbar-brand { font-size: 1rem; }
.navbar .form-control, .navbar form[role="search"] { display: none !important; }
.navbar .btn-outline-light { padding: .25rem .5rem; font-size: .875rem; }
}

.avatar-32 { width:32px; height:32px; object-fit:cover; }
.avatar-fallback { width:32px; height:32px; }