/**
 * @version     CVS: 0.0.1
 * @package     com_suites
 * @copyright   2023 FACT Werbeagentur GmbH
 * @license     GNU General Public License Version 2 oder später; siehe LICENSE.txt
 * @author      Benedikt & friends <info@fact-werbeagentur.de>
 */

.comSuites {
    --puettmann--font-size--sm: .9rem;
    --puettmann--color--primary: #c7af8c;
    --puettmann--color--white: white;
    --puettmann--comSuites--gap: 2rem;
}

@media screen and (min-width: 768px) {
    .comSuites {
        --puettmann--comSuites--gap: 3rem;
    }
}

@media screen and (min-width: 992px) {
    .comSuites {
        --puettmann--comSuites--gap: 4rem;
    }
}

@media screen and (min-width: 1200px) {
    .comSuites {
        --puettmann--comSuites--gap: 5rem;
    }
}

.comSuites .suitesWrapper {
    display: grid;
    gap: var(--puettmann--comSuites--gap);
    grid-template-columns: repeat(12, 1fr);
    margin-top: 4rem;
    margin-bottom: 3rem;
}

.comSuites .suitesWrapper .suiteItem {
    grid-column: auto / span 12;
}

@media screen and (min-width: 992px) {
    .comSuites .suitesWrapper .suiteItem {
        grid-column: auto / span 6;
    }     
    .comSuites .suitesWrapper .suiteItem:nth-child(odd) {
        margin-top: 5rem;
    }
}

.comSuites .suiteMedia a {
    position: relative;
    z-index: 1;
    display: block;
}

.comSuites .suiteMedia a::before {
    content: '';
    z-index: -1;
    position: absolute;
    top: -2rem;
    left: -2rem;
    width: 50%;
    aspect-ratio: 1;
    background-color: var(--puettmann--color--white);
}
  
.primaryPseudo .suiteMedia a::before {
    background-color: var(--puettmann--color--primary);
}

.comSuites .suiteMedia img,
.comSuites .suite img {
    margin: 0;
    padding: 0;
}

.comSuites .mediaCopyright {
    font-size: var(--puettmann--font-size--sm);
}