/* -------------------------------------------------------------------------- */
/* RTB-RESP.CSS (c) richardthebrave.com ------------------------------------- */

/* -----------------------------------------------------------------------------
* MARK: small (540px)
*/

@media only screen and (min-width: 540px) {

    .event-item {
        grid-template-columns: 1fr 4fr;
        grid-template-areas:
            "date info";
    }
    .event-item .event-time {
        align-items: center;
        flex-direction: column;
        font-size: var(--text-lg);
    }
    .event-item .event-time .contact-cta {
        text-align: center;
    }
    .type-is-ongoing .event-item .event-time {
        background-color: var(--neutral-bg);
        justify-content: center;
        align-content: center;
        padding: var(--space-sm) var(--space-sm) var(--space-base) var(--space-sm);
    }
    .gallery-block.count-is-3 .gallery,
    .gallery-block.count-is-6 .gallery {
        grid-template-columns: repeat(3, 1fr);
    }
    .gallery-block.count-is-3 .gallery li:first-child {
        grid-column: span 1;
    }
    .gallery-block.count-is-5 .gallery {
        grid-template-columns: repeat(6, 1fr);
    }
    .gallery-block.count-is-5 .gallery li {
        grid-column: span 2;
    }
    .gallery-block.count-is-5 .gallery li:first-child {
        grid-column: span 3;
    }
    .gallery-block.count-is-5 .gallery li:nth-child(2) {
        grid-column: span 3;
    }
    .sponsor-levels {
        grid-template-columns: repeat(2, 1fr);
    }
    .sponsor-levels.count-is-5 > :first-child {
        grid-column: span 2;
    }

    .event-item .event-time strong {
        font-size: var(--text-sm);
        font-weight: 600;
    }
    .event-item .event-time .year {
        color: var(--neutral-mid);
    }
    .rtbform .two-fields {
        grid-template-columns: repeat(2, 1fr);
    }

    .timeline-entry {
        grid-template-columns: calc(var(--space-xxl) * 2) auto;
    }

    .timeline-entry::before {
        left: var(--space-xxl);
        top: var(--space-lg);
    }

    .timeline-entry.has-month::before {
        top: calc(2 * var(--space-lg));
    }
    .timeline-dates {
        display: grid;
        text-align: center;
    }
    .timeline-text {
        padding: 0;
    }
    .timeline-month {
        font-size: var(--text-sm);
    }
    .rtbform .radio-group {
        grid-template-columns: repeat(2, 1fr);
    }


}

/* -----------------------------------------------------------------------------
* MARK: medium (800px)
*/

@media only screen and (min-width: 800px) {

    .columns {
        grid-template-columns: repeat(12, 1fr);
    }

    .zone-copy {
        max-width: calc(66.6666% + var(--space-lg));
    }

    .column {
        grid-column: span var(--span);
    }

    .post-body--event > :first-child {
        order: unset;
    }

    .news-item {
        grid-template-columns: var(--space-xl) auto;
    }

    .cards-block.has-2-cards,
    .cards-block.has-4-cards {
        grid-template-columns: repeat(2, 1fr);
    }

    .blurbs-block {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .has-portrait .page-title-copy {
        padding-block: var(--space-lg);
    }
    .page-title.has-portrait {
        text-align: left;
    }

    .page-bio-img {
        max-width: none;
    }

    .site-footer-inner {
        display: grid;
        grid-template-columns: 2fr 3fr;
        grid-template-areas: 
        "logo nav"
        "address blurb"
        "meta blurb";
    }

    .site-footer-nav {
        align-self: center;
        justify-content: end;
    }

    .site-footer-blurb {
        text-align: right;
        align-self: end;
    }
    .site-footer-logo {
        align-self: start;
    }
    .site-footer-meta {
        align-self: end;
    }

    .sponsor-levels {
        grid-template-columns: repeat(4, 1fr);
    }
    .sponsor-levels.count-is-5 {
        grid-template-columns: repeat(12, 1fr);
    }
    .sponsor-levels.count-is-5 .sponsor-level {
        grid-column: span 4;
    }
    .sponsor-levels.count-is-5 > :first-child,
    .sponsor-levels.count-is-5 > :nth-child(2) {
        grid-column: span 6;
    }


    .sponsor-level {
        padding: var(--space-xl) var(--space-md);
    }
    .sponsors {
        grid-template-columns: repeat(3, 1fr);
    }
    .sponsors.sponsor-level-all {
        grid-template-columns: repeat(3, 1fr);            
    }
    .has-portrait .page-title-copy-inner {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-xl);
    }
    .page-bio-img {
        margin-bottom: 0;
    }

    /* HEADER NAVIGATION STUFF BELOW HERE!! */
    /* ensure the cloned menu stays hidden */
    #mm-clone-header-menu   { display: none !important; }
    #mobile-nav-toggle     { display: none !important; }

    .site-navbar {
        align-items: unset;
        display: grid;
        gap: 0;
        grid-template-columns: max-content auto;
        grid-template-areas:
            "logo eyebrow"
            "nav nav"
        ;
        justify-content: unset;
    }

    /* show the previously-hidden header AND eyebrow navigation */
    .header-menu,
    .site-eyebrow {
        display: flex;
        /* height: 100%; */
        justify-content: end;
    }

    .site-eyebrow {
        align-items: center;
        gap: var(--space-md);
    }

    .header-menu {
        justify-content: center;
    }

    .header-menu__ul       { align-items: center; border-top: 1px solid var(--neutral-light); display: flex; justify-content: space-evenly; gap: var(--space-lg); list-style: none; margin: var(--space-md) 0 0 0; padding: var(--space-md) 0 0 0; width: 100%; }
    .header-menu__li       { height: 100%; }

    /* style the header navigation menu */
    .header-menu__a                      { display: block; font-size: var(--text-sm); font-weight: 550; padding: var(--space-tiny) 0; text-decoration: none; }
    .header-menu__a:hover                { background-color: var(--white); outline-color: var(--neutral-light);  }
    
    .header-menu .has-child             { position: relative; }
    .header-menu .has-child:hover > a   { background-color: var(--white); outline-color: var(--neutral-light); }

    .header-menu__icon  { font-size: 60%; display: inline-block; transform: translateY(-2px); }

    /* child / drop-down menus */
    .header-menu__child-ul                 {
        background-color: white;
        box-shadow: 0 var(--space-sm) var(--space-md) rgba(0, 0, 0, 0.2);
        border-top: var(--space-tiny) solid var(--secondary);
        border-radius: var(--radius-xs);
        display: none;
        left: 0;
        list-style: none;
        margin: 0;
        overflow: hidden;
        padding: var(--space-xs);
        position: absolute;
        text-align: left;
        top: 100%;
        width: auto;
        max-width: 100%;
        min-width: 18rem;
        z-index: 999;
    }
    .header-menu__child-ul a               { background: white; display: block; font-size: var(--text-sm); font-weight: 500; padding: var(--space-xs) var(--space-sm); position: relative; white-space: wrap; text-decoration: none; }
    .header-menu__child-ul a:hover         { background-color: var(--secondary-bg); color: var(--primary-dark);  }


}

/* -----------------------------------------------------------------------------
* MARK: medium-large (1000px)
*/

@media only screen and (min-width: 1000px) {

    .site-logo::before,
    .site-logo::after {
        --circle-diameter: 23.5rem;
        --logo-width: 10rem;
        --offset: calc( -1 * ( ( var(--circle-diameter) - var(--logo-width)) / 2 ) );

        background-image: url('/assets/img/logo-bg.webp');
        background-position: center;
        background-size: cover;
        border-radius: 50%;
        content: '';
        height: var(--circle-diameter);
        position: absolute;
        width: var(--circle-diameter);
        left: var(--offset);
        top: var(--offset);
        z-index: 1;
    }

    .site-logo::after {
        --circle-diameter: 15rem;
        background: var(--white);
        z-index: 2;
    }

    .site-logo {
        transform: translateY(var(--space-lg));
    }

    .site-logo img {
        position: relative;
        z-index: 3;
    }



    .site-navbar-wrap {
        padding-block: var(--space-lg) calc(0.8125 * var(--space-xl));
    }
    .site-navbar {
        row-gap: var(--space-xl);
    }


    .site-navbar {
        grid-template-areas:
            "logo eyebrow"
            "logo nav"
        ;
    }

    .header-menu__ul {
        align-self: end;
        border: 0;
        justify-content: end;
        margin: 0;
        padding: 0;
    
    }

    .page-title-copy-inner {
        margin-top: var(--space-xxl);
    }
    .sponsors.sponsor-level-all {
        grid-template-columns: repeat(4, 1fr);            
    }

    .sponsors.sponsor-level-sk-den-partners {
        grid-template-columns: repeat(4, 1fr);
    }

    .event-item {
        grid-template-columns: 1fr 5fr;
    }    

}

/* -----------------------------------------------------------------------------
* MARK: large (1200px)
*/

@media only screen and (min-width: 1200px) {


    .template-is-home .site-logo::before,
    .template-is-home .site-logo::after {
        --circle-diameter: 28rem;
        --logo-width: 14rem;
    }
    .template-is-home .site-logo::after {
        --circle-diameter: 19rem;
    }

    .template-is-home .site-logo, .template-is-home .site-logo img {
        width: 14rem;
    }

    .template-is-home .site-logo::after,
    .template-is-home .site-logo::before {
        transform: translateY(calc(-1 * var(--space-md)));
    }


    .gallery-block.count-is-4 .gallery {
        grid-template-columns: repeat(4, 1fr);
    }


    .page-title {
        min-height: calc(var(--space-huge) * 5.75);
    }

    .news-item {
        grid-template-columns: var(--space-xxl) auto;
    }

    .sponsors {
        grid-template-columns: repeat(4, 1fr);
    }
    .sponsors.sponsor-level-all {
        grid-template-columns: repeat(5, 1fr);            
    }
    .sponsors:not(.sponsor-level-sk-den-partners) > .sponsor:hover {
        border-color: var(--neutral-bg);
        transform: scale(1.333);
        z-index: 3;
    }
}

/* -----------------------------------------------------------------------------
* MARK: x-large (1440px)
*/

@media only screen and (min-width: 1440px) {

    .site-logo {
        transform: translateY(var(--space-lg)) translateX(calc(-1 * var(--space-xl)));
    }

    .sponsors {
        grid-template-columns: repeat(5, 1fr);
    }

    .sponsors.sponsor-level-all {
        grid-template-columns: repeat(6, 1fr);            
    }

    .zone > .zone-bg {
        left: -40%;
        right: -40%;
        width: 180%;
    }

    .gallery-block.count-is-5 .gallery {
        grid-template-columns: repeat(5, 1fr);
    }
    .gallery-block.count-is-5 .gallery li {
        grid-column: span 1 !important;
    }


}

/* -----------------------------------------------------------------------------
* MARK: xx-large (1820px)
*/

@media only screen and (min-width: 1820px) {

    .gallery-block.count-is-6 .gallery {
        grid-template-columns: repeat(6, 1fr);
    }

}