/* Responsive overrides for Alzentra pages */
/* Mobile first adjustments */
html,
body {
    height: 100%;
}

img,
svg,
video {
    max-width: 100%;
    height: auto;
}

.container {
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
}

nav {
    padding: 12px 4%;
}

.nav-links {
    gap: 12px;
    flex-wrap: wrap;
    align-items: center
}

.nav-links a,
.nav-links .btn {
    font-size: 0.95rem;
    padding: 8px 12px
}

.logo {
    font-size: 1.25rem
}

/* Grid -> single column on small screens */
.grid-2 {
    grid-template-columns: 1fr !important;
}

.hero {
    padding: 100px 4% 48px
}

.card {
    padding: 16px !important;
    border-radius: 10px
}

/* Buttons full width on mobile for forms */
.btn,
button[type=submit] {
    width: 100%;
    display: block
}

/* Tables: horizontal scroll on small screens */
.table-wrap {
    overflow-x: auto;
}

/* Keep table semantics intact and let .table-wrap handle scrolling */
table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    min-width: 720px;
}

/* Small tweaks */
.stat-value {
    font-size: 1.5rem
}

@media(min-width:768px) {
    .grid-2 {
        grid-template-columns: 1fr 1fr;
    }

    .nav-links {
        gap: 24px
    }

    .btn {
        width: auto
    }
}

@media(min-width:1024px) {
    .container {
        max-width: 1100px;
        margin: 0 auto;
        padding-left: 24px;
        padding-right: 24px
    }
}