body {
    width: 100%;
    text-align: center;
    padding-top: 80px;
}

h1 {
    font-weight: 700 !important;
    font-size: 22px !important;
}

.mobileMenu h1 {
    margin: 0px !important;
    padding: 0px !important;
}

#mainContainer {
    text-align: left;
    margin: 0px auto;
    background-color: #f4f4f9;
}

.anchor {
    scroll-margin-top: 120px;
}

img {
    width: 100%;
    object-fit: fill;
    padding-bottom: 10px;
}

.cards-row {
  display: flex;
  flex-wrap: wrap;
  row-gap: 16px; /* or whatever spacing you want */
}

.cards-row .card-col {
  display: flex;
}

.cards-row .card {
  flex: 1 1 auto;   /* fill the column */
}

/* 2. Desktop Layout (Screens 740px and wider) */
@media (min-width: 740px) {
    #mainContainer {
        max-width: 1024px;
        text-align: left;
        margin: 0px auto;
        background-image: url('./images/background.png');
        height: 100%;
        width: 100%;
        background-position: center top;
        background-size: contain ;
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-color: #cbb89d;
    }
}