/* Grid System - Bootstrap-like but simplified */
*, *::before, *::after {
    box-sizing: border-box;
}

.row {
    display: flex;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
}

.row > * {
    padding-left: 15px;
    padding-right: 15px;
}

.col-lg-12, .col-lg-6, .col-lg-4, .col-lg-3,
.col-md-12, .col-md-6, .col-md-4, .col-md-3,
.col-sm-12, .col-sm-6, .col-sm-4, .col-sm-3,
.col-xl-3, .col-xl-9 {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
}

/* Large screens (≥992px) */
@media (min-width: 992px) {
    .col-lg-12 { width: 100%; }
    .col-lg-6 { width: 50%; }
    .col-lg-4 { width: 33.333333%; }
    .col-lg-3 { width: 25%; }
}

/* Medium screens (≥768px) */
@media (min-width: 768px) {
    .col-md-12 { width: 100%; }
    .col-md-6 { width: 50%; }
    .col-md-4 { width: 33.333333%; }
    .col-md-3 { width: 25%; }
}

/* Small screens (≥576px) */
@media (min-width: 576px) {
    .col-sm-12 { width: 100%; }
    .col-sm-6 { width: 50%; }
    .col-sm-4 { width: 33.333333%; }
    .col-sm-3 { width: 25%; }
}

/* Extra large screens (≥1200px) */
@media (min-width: 1200px) {
    .col-xl-3 { width: 25%; }
    .col-xl-9 { width: 75%; }
}

/* Utility classes */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-white { color: #fff; }
.mb-0 { margin-bottom: 0; }
.mb-4 { margin-bottom: 1rem; }
.mb-xl-5 { margin-bottom: 3rem; }
.mb-lg-5 { margin-bottom: 3rem; }
.mb-md-4 { margin-bottom: 1.5rem; }
.mb-sm-4 { margin-bottom: 1.5rem; }
.m-0 { margin: 0; }
.pb-2 { padding-bottom: 0.5rem; }
.pt-2 { padding-top: 0.5rem; }
.pt-md-2 { padding-top: 0.5rem; }
.pb-md-2 { padding-bottom: 0.5rem; }
.pt-0 { padding-top: 0; }
.pb-0 { padding-bottom: 0; }
.pl-xl-0 { padding-left: 0; }
.pr-xl-0 { padding-right: 0; }
.pl-lg-0 { padding-left: 0; }
.pr-lg-0 { padding-right: 0; }
.pl-md-0 { padding-left: 0; }
.pr-md-0 { padding-right: 0; }
.pl-sm-0 { padding-left: 0; }
.pr-sm-0 { padding-right: 0; }
.pl-0 { padding-left: 0; }
.pr-0 { padding-right: 0; }
.float-right { float: right; }
.list-unstyled { list-style: none; padding: 0; margin: 0; }
.list-inline { display: flex; flex-wrap: wrap; }
.list-inline-item { display: inline-block; }
.img-fluid { max-width: 100%; height: auto; }