:root{
    --ease: 300ms ease;
    --transition: scale(1.1);
}

.auto-grid{
	 --width: 200px;
	 --gap: 1rem;
	 display: grid;
	/*grid-template-columns: repeat(auto-fill, minmax(var(--width), 1fr));
	*/
	 grid-template-columns: repeat(auto-fill, minmax(min(var(--width), 100%), 1fr));
	 gap: var(--gap);
}

.homepage{
    .wrap {
        max-width: 90rem;
        margin-right: auto;
        margin-left: auto;
        padding-right: 1rem;
        padding-left: 1rem;
    }

    /* White and Beige Buttons (Beige now updating to white) */
    .button-group,.module__container {
        --button-transition-timing: 150ms ease-in-out;
        --teal: #0b7886;
        .button-group .button:not(.hero__button):not(footer .button) {
            background-color: white; /* White background for buttons without hero__button class */
            color: black;
        }
        .hero__button{
                
                color: black; /* White text on hover */
        }
        .button {
            transition: 
            background-color var(--button-transition-timing), 
            color var(--button-transition-timing),
            border-color var(--button-transition-timing);
            &:hover {
                background-color: var(--teal); /* Teal background on hover */
                border-color: var(--teal);
                color: white;
            }
        }
    }
    @media (min-width: 1025px){
        .hero-container .button-group .hero__button {
            color: white;
        }
    }
    
    .overlay .button-group{
        display: flex;
        gap: 1em;
        justify-content: center;
    }
    .hero-container:has(.hero__button) .button {
        text-shadow: none; /* Remove text-shadow */
    }
    .hero__control {
    	background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22%23fff%22%20width%3D%2257%22%20height%3D%2257%22%20viewBox%3D%220%200%2057%2057%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20transform%3D%22translate%281%201%29%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Ccircle%20stroke%3D%22%23FFF%22%20stroke-width%3D%222%22%20fill%3D%22%232F2F2F%22%20cx%3D%2227.5%22%20cy%3D%2227.5%22%20r%3D%2227.5%22%2F%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M20%2039.89V15l21%2012.444%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E);
    	display: none;
    	position: absolute;
    	top: 1rem;
    	left: 1rem;
    	width: 3rem;
    	height: 3rem;
    	background-color: #000;
    	border-radius: 50%;
    	color: #000;
    	background-size: 3rem
    }
    
    @media (min-width:64.0625em) {
    	.hero__control {
    		display: block
    	}
    }
    
    .hero__control--playing {
    	background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22%23000%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2057%2057%22%3E%3Cstyle%3E.st0%7Bfill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bfill%3A%232F2F2F%3Bstroke%3A%23FFFFFF%3Bstroke-width%3A2%3B%7D%20.st1%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3Cg%20id%3D%22Homepage%22%3E%3Cg%20id%3D%22Brandeis-Advancement-Concept-1%22%3E%3Cg%20id%3D%22Group-30%22%3E%3Cg%20id%3D%22Catch-Up%22%3E%3Cg%20id%3D%22Group-34%22%20transform%3D%22translate%281%201%29%22%3E%3Ccircle%20id%3D%22Oval%22%20class%3D%22st0%22%20cx%3D%2227.5%22%20cy%3D%2227.5%22%20r%3D%2227.5%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fg%3E%3Cpath%20class%3D%22st1%22%20d%3D%22M18%2016h5.1v24.9H18zM33.9%2016.1H39V41h-5.1z%22%2F%3E%3C%2Fsvg%3E);
    	background-color: #fff;
    	background-size: 3rem;
    	z-index: 3;
    }
    /* Default styles for smaller screens */
    .hero--video img {
        display: block; /* Ensure the image is visible by default */
    }
    
    .hero__video {
        display: none; /* Hide the video by default */
        width: 100%;
        height: 100%;
        background-color: #000;
        overflow: hidden;
        z-index: -1;
    }
    .hero__content-video-caption {
        display: none;
        left: unset;
        width: fit-content;
        right: 2%;
        bottom: 3rem; /* matches the same bottom padding/margin as the hero content */
        .caption{
            line-height: 1; /* ensures the styling does line up well as the line height might make it appear to have padding*/
        }
    }
    
    /* Styles for screens wider than 64.0625em */
    @media (min-width: 64.0625em) {
        .hero--video img {
            display: none; /* Hide the image on larger screens */
        }
    
        .hero__video {
            display: block; /* Show the video on larger screens */
        }
        
        .hero__content-video-caption{
            display: block;
        }
    }
    
    .module__container__link img{
        display:block;
        
        transition: transform var(--ease);
    }
    .module__container__link .link__item,
    .module__container__link .media__item{
        overflow: hidden;
    }
    .module__container__link:hover img{
        transform: var(--transition);
    }
    
    
    /*Testimonial Slider styles*/
    .testimonial__slider .module__container{
        width:100%
        }
        .testimonial__slider .flickity-page-dots{
            margin-top:3rem;
            position:static
        }
        .testimonial__slider .flickity-page-dots .dot{
            color:#fff
        }
        .testimonial__slider .flickity-prev-next-button{
            top:auto;
            bottom:-3rem
        }
        @media (min-width:64.0625em){
            .testimonial__slider .flickity-prev-next-button{
                top:50%;
                bottom:auto
            }
        }
        @media (min-width:64.0625em){
            .testimonial__slider .flickity-prev-next-button.previous{
                left:-3rem
            }
        }
        @media (min-width:64.0625em){
            .testimonial__slider .flickity-prev-next-button.next{
                right:-3rem
            }
        }
        .testimonial__image{
            margin:2rem auto;
            width:6.25rem;
            height:6.25rem
        }
        .testimonial__bottom{
            display:-ms-flexbox;
            display:flex;
            -ms-flex-align:center;
            align-items:center;
            -ms-flex-pack:center;
            justify-content:center
        }
        .testimonial__bottom .testimonial__image{
            margin-left:1.5rem;
            margin-right:1.5rem
        }
        .testimonial__bottom .p--large{
            margin-bottom:0
        }
    .grid__container--scroll:before{
        display: none;
    }
}
.button-stack {
	margin-top: 1rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin-left: -1rem;
	margin-right: -1rem;
}


.button-stack__item {
	display: flex;
	flex-grow: 1;
	margin-bottom: 2rem !important;
	margin-left: 1rem;
	margin-right: 1rem;
}
.button-stack--3 .button-stack__item,
.button-stack--2 .button-stack__item {
	width: 100%;
}
.button-stack__item .button {
	flex-grow: 1;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0.85rem 1.875rem;
	border: 0.0625rem solid transparent;
	border-radius: 0.1875rem;
	color: #003478;
	font-family: "Hind", sans-serif;
	font-size: 0.93rem;
	font-weight: 600;
	letter-spacing: 0.01rem;
	line-height: 1.1667;
	text-transform: uppercase;
	background-color: #fff;
	border-color: #003478;
}

.button-stack__item .button:hover,
.button-stack__item .button:focus {
	background-color: #0b7886;
	border-color: #0b7886;
	color: #fff;
	text-decoration: none;
}

[data-whatinput='keyboard'] .button-stack__item .button:hover,
[data-whatinput='keyboard'] .button-stack__item .button:focus {
	outline-offset: 0.125rem;
}

.button-stack__item .button--secondary {
	border-color: #003478;
	color: #fff;
	background-color: #003478;
}

.button-stack__item .button--secondary:hover,
.button-stack__item .button--secondary:focus {
	background-color: #0b7886;
	border-color: #0b7886;
	color: #fff;
}

@media (min-width: 32em) {
	.button-stack--3 .button-stack__item {
		flex-grow: 0;
		width: calc(33% - 2rem);
	}

	.button-stack--2 .button-stack__item {
		flex-grow: 0;
		width: calc(50% - 2rem);
	}
}