* {
    margin: 0;
    padding: 0;
}

.content-row {
    justify-self:center;
    display: flex;
    align-items: center;
    flex-wrap:wrap;
    justify-content:center;
    gap: 1rem;
}

#brand-design {
    background-color: var(--lblue);
}

figure {
    figcaption {display:inline;opacity:0;transition:0.2s;}
    img {opacity:1;transition: 0.2s;}
}

figure:hover {
    figcaption {opacity:1;}
    img {opacity:0.5;}
}

figcaption {
    color: var(--whte);
    text-align: center;
    position: relative;
}

.itsy-grid img, .itsy-grid video {
    object-fit:cover;
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 1rem;
}

.itsy-grid {
    display: grid;
    grid-template-rows: auto auto;
    background-color: var(--whte);
}

.itsy-grid > div {
    min-width: 0;
    min-height: 0;
    transition: 0.2s;
}

#brand-design .itsy-grid {
    grid-template-areas:
    "itsy-1 itsy-1 itsy-4"
    "itsy-2 itsy-3 itsy-4";
}

#misc img {
    height:100%;
}

.acc_date {
    padding:8px 12px;
    border-radius:24px;
    background-color:var(--yellow);
    width:fit-content;
}

@media screen and (max-width:729px) {
    h2 {font-size:2em;padding:1rem;}
    h3 {font-size:5vw;padding:1rem 0;}
    p {font-size:3.8647342995169vw;}
    section {padding:0;}
    #accomplishments .release-grid {
    grid-template-areas:
        "release-1"
        "release-2";
    }
    .acc_date {font-size:3.3816425120773vw;}
    .release-grid {grid-template-rows:auto auto;width:100%;}
    #brand-design .itsy-grid {
        grid-template-areas:
            "itsy-4 itsy-4"
            "itsy-1 itsy-1"
            "itsy-2 itsy-3";
    }
    .itsy-grid {grid-template-columns: 36fr 64fr;
    grid-template-rows: auto auto auto;width:100%;gap:0.5rem;padding:1rem;}
    .itsy-grid img, .itsy-grid video, .release-grid img, .release-grid video {border-radius:1rem;height:100%;}
    .brand-logo {width:100%;}
    .brand-logo img {width:50%;}
    .content-row {width:100%;}
}

@media screen and (min-width:730px) {
    h2 {font-size:4vw;padding:0.833333vw;}
    h3 {font-size:1.15vw;padding:0.833333vw 0;}
    p {font-size:0.9vw;}
    section {padding:1rem;}
    #accomplishments .release-grid {
    grid-template-areas:
        "release-1 release-2";
    }
    .release-grid {grid-template-columns:1fr 2fr;width:60%;}
    #brand-design .itsy-grid {
        grid-template-areas:
            "itsy-1 itsy-1 itsy-4"
            "itsy-2 itsy-3 itsy-4";
    }
    .itsy-grid {grid-template-columns: 26.470588235fr 47.058823529fr 26.470588235fr;
    grid-template-rows: auto auto;width:75%;gap:0.833333vw;padding:0.833333vw;width:60%;aspect-ratio:1132.8/691.56;}
    .itsy-grid img, .itsy-grid video, .release-grid img, .release-grid video {border-radius:0.833333vw;}
    .brand-logo {width:20vw;}
    .brand-logo img {filter: drop-shadow(2px 6px 6px var(--blck));}
    .content-row {width:100%;}
}

@media screen and (min-width:1350px) {
    p {font-size:1vw;}
}