.home-main {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.home-section {
    width: 50%;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center; 
}

.home-aside {
    width: 50%;
    display: flex;
    justify-content: center; 
    align-items: center; 
}

.home-aside img {
    max-width: 100%; 
    height: auto;
}
.home-award-winning {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    background-color: var(--background);
    height: 45rem;
}

.home-award-winning-left {
    width: 50%;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 3rem;
    background-color: var(--background);
}

.home-award-winning-right {
    width: 50%;
    height: 100%;
    background-color: var(--blue-light);
    overflow: hidden;
}

/* Make ANY wrapper fill the container */
.home-award-winning-right > * {
    width: 100%;
    height: 100%;
    display: block;
}

/* Make the image fill its wrapper and crop */
.home-award-winning-right img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.home-synappro-breathe {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: var(--pink-light);
    padding-top: 2rem;
}

.home-synappro-breathe-buttons {
    display: flex;
    flex-direction: row;
    align-items: left;
    justify-content: left;
    padding-top: 2rem;
    flex-wrap: wrap;
    column-gap: 2rem;
    row-gap: 2rem;
}

.home-synappro-breathe-buttons a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

.home-synappro-breathe-photo img {
    padding-top: 3rem;
    width: 25rem;
    height: auto;
    object-fit: contain; 
}

.home-supported-by {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: var(--light);
    /* margin: 3rem;
    border-radius: 2ch; */
    padding: 2rem;
    gap: 2rem;
}

.home-supported-by-logos {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap; 
    justify-content: center; 
    gap: 5rem;
    padding-bottom: 2rem;
}

.home-supported-by-logos img {
    width: 10rem;
    height: auto;
    object-fit: contain; 
}

.home-button {
    display: flex;
    justify-content: center;
}

.home-main-apps-button a:hover {
    color: var(--red);
    transition: 300ms;
}

.home-apps-button a,
.home-synappro-breathe-learn-more a,
.home-synappro-breathe-app-store a,
.home-award-winning-about-synappro a,
.home-meet-the-team a {
    text-decoration: none;
    padding-left: 2rem;
    padding-right: 2rem;
        padding-top: 1rem;
    padding-bottom: 1rem;
    border-radius: 1ch;
}

.home-apps-button a {
    background-color: var(--blue-dark);
    color: var(--white);
}

.home-synappro-breathe-learn-more a{
    background-color: var(--blue-dark);
    color: var(--white);
}

.home-synappro-breathe-app-store a {
    background-color: var(--white);
    border-color: var(--blue-dark);
    color: var(--blue-dark);
    border-style: solid;
}

.home-award-winning-about-synappro a {
    background-color: var(--blue-dark);
    color: var(--white);
}

.home-meet-the-team a {
    background-color: var(--white);
    border-color: var(--blue-dark);
    color: var(--blue-dark);
    border-style: solid;
}

.home-apps-button a:hover,
.home-synappro-breathe-learn-more a:hover,
.home-synappro-breathe-app-store a:hover,
.home-award-winning-about-synappro a:hover,
.home-meet-the-team a:hover {
    opacity: 50%;
    transition: 300ms;
}

/* .home-video{
    display: flex;
    height: 53rem;
}

.home-video video {
    width: 100%;
    height: auto;
    display: block;
} */

.home-video{
    width: 100%;
    height: 53rem;        
    overflow: hidden;
}

.home-video video {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;     
}


/* Media queries */
@media only screen and (max-width: 425px) {
    .home-main,
    .home-award-winning {
        flex-direction: column;
    }

    .home-award-winning-left,
    .home-award-winning-right {
        width: 100%;
    }

    .home-award-winning-left {
        padding-bottom: 6rem;
    }

    .home-award-winning {
        height: auto; /* important, otherwise 45rem forces awkward spacing */
    }

    .home-paragraph p {
        margin-bottom: 3rem;
        margin-top: -0.5rem;
    }

    .home-aside img {
        width: 80%;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .big-text {
        font-size: 2.5rem;
        margin-top: -0.7rem;
    }

    .home-section {
        width: 100%;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .home-aside {
        width: 100%;
        margin-top: 6rem;
    }

    .supported-by-title {
        font-size: 1.5rem;
    }

    .home-supported-by-logos {
        gap: 2rem;
    }

    .home-supported-by-logos img {
        width: 5rem;
        height: auto;
        object-fit: contain; 
    }
    
}

@media only screen and (min-width: 426px) and (max-width: 666px) {
    .home-main,
    .home-award-winning {
        flex-direction: column;
    }

    .home-award-winning-left,
    .home-award-winning-right {
        width: 100%;
    }

    .home-award-winning-left {
        padding-bottom: 6rem;
    }

    .home-award-winning {
        height: auto; /* important, otherwise 45rem forces awkward spacing */
    }

    .home-paragraph p {
        margin-bottom: 5rem;
        margin-top: 1rem;
    }

    .home-aside img {
        width: 60%;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .home-section {
        width: 100%;
    }

    .home-aside {
        width: 100%;
        margin-top: 6rem;
    }

    .supported-by-title {
        font-size: 1.5rem;
    }

    .home-supported-by-logos {
        gap: 3rem;
    }

    .home-supported-by-logos img {
        width: 7rem;
        height: auto;
        object-fit: contain; 
    }

}

@media only screen and (min-width: 667px) and (max-width: 768px) {
    .home-main,
    .home-award-winning {
        flex-direction: column;
        margin-top: 2rem;
    }
    
    .home-award-winning-left,
    .home-award-winning-right {
        width: 100%;
    }

    .home-award-winning-left {
        padding-bottom: 9rem;
    }

    .home-award-winning {
        height: auto; /* important, otherwise 45rem forces awkward spacing */
    }

    .home-paragraph p {
        margin-bottom: 5rem;
        margin-top: 1rem;
    }

    .home-aside img {
        width: 40%;
        margin-bottom: 1rem;
        margin-top: 1rem;
    }

    .home-section {
        width: 100%;
        margin-bottom: 1rem;
        margin-top: 1rem;
    }

    .home-aside {
        width: 100%;
        margin-top: 2rem;
        margin-bottom: -2rem;
    }

    .supported-by-title {
        font-size: 1.5rem;
    }

    .home-supported-by-logos {
        gap: 3rem;
    }

    .home-supported-by-logos img {
        width: 7rem;
        height: auto;
        object-fit: contain; 
    }
}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
    .home-main {
        flex-direction: row;
        margin-top: 2rem;
        gap: 2rem;
    }

    .home-paragraph p {
        margin-bottom: 5rem;
        margin-top: 1rem;
    }

    .home-aside img {
        width: 60%;
    }

    .home-section, .home-aside {
        width: 100%;
        padding-bottom: 2rem;
    }

    .supported-by-title {
        font-size: 1.8rem;
    }

    .home-supported-by-logos {
        gap: 3rem;
    }

    .home-supported-by-logos img {
        width: 7rem;
        height: auto;
        object-fit: contain; 
    }
}

@media only screen and (min-width: 1025px) and (max-width: 1439px) {
    .home-main {
        flex-direction: row;
        margin-top: 1rem;
        gap: 1rem;
        padding-bottom: 2rem;
    }

    .home-paragraph p {
        margin-bottom: 5rem;
        margin-top: 1rem;
    }

    .home-aside img {
        width: 60%;
    }

    .home-section, .home-aside {
        width: 100%;
        padding-bottom: 2rem;
    }

    .supported-by-title {
        font-size: 2.2rem;
    }

    .home-supported-by-logos {
        gap: 3rem;
    }

    .home-supported-by-logos img {
        width: 8rem;
        height: auto;
        object-fit: contain; 
    }
}

@media only screen and (min-width: 1440px) and (max-width: 1800px){
    .home-main {
        flex-direction: row;
        margin-top: -2rem;
        gap: 3rem;
        padding-bottom: 2rem;
    }

    .home-paragraph p {
        line-height: 2.3;
        margin-bottom: 4rem;
        margin-top: 1rem;
    }

    .home-aside img {
        width: 45%;
        margin-bottom: 1rem;
        margin-top: 1rem;
    }

    .big-text {
        font-size: 4rem;
    }

    .home-section, .home-aside {
        width: 100%;
        padding-bottom: 2rem;
        padding-top: 2rem;
    }

    .supported-by-title {
        font-size: 2.2rem;
    }

    .home-supported-by-logos {
        gap: 5rem;
    }

    .home-supported-by-logos img {
        width: 10rem;
        height: auto;
        object-fit: contain; 
    }
}

@media only screen and (min-width: 1801px){
    .home-main {
        flex-direction: row;
        margin-top: -3rem;
        gap: 3rem;
        padding-bottom: 2rem;
    }

    .home-award-winning-right img {
        width: 40%;
    }

    .home-paragraph p {
        line-height: 2.3;
        margin-bottom: 5rem;
        margin-top: 1rem;
    }

    .home-aside img {
        width: 40%;
        margin-bottom: 1rem;
        margin-top: 2rem;
    }

    .home-section, .home-aside {
        width: 100%;
        padding-bottom: 2rem;
    }
    
    .supported-by-title {
        font-size: 2.2rem;
    }

    .home-supported-by-logos {
        gap: 5rem;
    }

    .home-supported-by-logos img {
        width: 10rem;
        height: auto;
        object-fit: contain; 
    }
}

