/*
RESPONSIVE
Last updated: 30/05/2025
The standard set of breakpoint thresholds is as follows:
huge	1440
wide	1280
large	960
medium	782
small	600
mobile	480
*/

@media only screen and (min-width: 1px) and (max-width: 1690px)  {

	header .wp-block-acf-menu {
		flex: 1;
	}
	
	.header-inner {
		gap: 3vw !important;
	}
	
	.wp-block-group.header-nav {
		justify-content: space-between !important;
		gap: 2rem !important;
	}
	
	.wp-block-group.header-nav .navigation-container {
		justify-content: space-between;
		gap: 0 !important
	}
	
}

@media only screen and (min-width: 1px) and (max-width: 1366px)  {
	
	header .wp-block-acf-menu ul.navigation-container > li {
		--menu-typography-font-size: 13px;
	}
	
}


@media only screen and (min-width: 1px) and (max-width: 1280px)  {

}

@media only screen and (min-width: 1px) and (max-width: 1230px)  {

	header nav.wp-block-acf-menu {
		flex: unset;
		order: 2;
	}	
	button.mobile-navigation-button {
		width: 52px;
		height: 52px;
	}
	
	.wp-block-group.header-nav {
	justify-content: flex-end !important;
        gap: 0rem !important;
		height: 52px;
	}
	.search-container {
		padding: 0 !important;
		margin-left: 0 !important
	}
	.search-container button {
		width: 52px;
		height: 52px;
	}
	
	button.mobile-navigation-button:not(.active) {
		background-color: var(--wp--preset--color--custom-red-penn);
		color: var(--wp--preset--color--custom-white);
	}
	.mobile-navigation-button span.open {
		display: flex;
        flex-direction: column;
		align-items: flex-end;
		justify-content: space-evenly;
        height: 60%;
	}
	.mobile-navigation-button span.close {
	    font-variation-settings: 'wght' 300;
	}
	.mobile-navigation-button span.open .line {
		height: 2px;
		width: 20px;
		background-color: white;
	}
	.mobile-navigation-button span.open .line:nth-child(2) {
		width: 16px;
	}
	.mobile-navigation-button span.open .line:nth-child(3) {
		width: 12px;
	}
	header .navigation-link {
		text-align: left;
	}
	
	:root body {
		--wp--style--root--padding-right: 3rem !important;
	    --wp--style--root--padding-left: 3rem !important;
	}
	.wp-block-acf-swiper.homepage-slider .swiper-content {
		padding-left: calc(var(--wp--style--root--padding-right) * 1.5)
	}
	
	.wp-block-cover.page-header,
	:root body .homepage-slider.wp-block-acf-swiper,
	:root body .homepage-slider.wp-block-acf-swiper .swiper-slide,
	:root body .homepage-slider.wp-block-acf-swiper .swiper-slide img {
    	min-height: 545px !important;
	}
	
	.wp-block-group.impact-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	
}

@media only screen and (min-width: 1px) and (max-width: 1070px)  {

	footer .wp-block-acf-menu ul.navigation-container {
		columns: 1;
	}
	footer .wp-block-acf-menu ul.navigation-container li {
		margin-bottom: 0;
	}
	footer .wp-block-spacer {
		display: none;
	}
	
	footer .wp-block-group.logo-address {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
	}
	
	footer .wp-block-group.links-logo {
		flex-direction: column;
		align-items: flex-start;
		text-transform: uppercase;
	}
	footer .wp-block-group.links-logo p {
		font-size: 15px !important;
	}
	
	footer .quicklinks-charity {
		flex-basis: 220px;
	}

	
	footer .footer-wrap {
		flex-wrap: nowrap;
	}
	
	footer .wp-block-group.donate {
		flex-basis: 33.33%;
	}
	
	footer .footer-socials {
		width: 100%;
	}
	
	.wp-block-group.values-icons {
		display: flex;
		flex-wrap: wrap;
	}
	.wp-block-group.values-icons > * {
		flex: 1;
	}
	
	.wp-block-columns.icon-columns-4 {
		flex-wrap: wrap !important;
	}
	
	.wp-block-columns.icon-columns-4 .wp-block-column.icon-box {
		flex-basis: 50%;
	}
		
.wp-block-column.icon-box:nth-child(odd)::after {
    transform: translatex(-99%) scaleX(1.5);
    transform-origin: right;
}
.wp-block-column.icon-box:nth-child(odd)::after,
	.wp-block-column.icon-box:nth-child(even)::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: inherit;
}
	
.wp-block-column.icon-box:nth-child(even)::after {
    transform: translatex(99%) scaleX(1.5);
    transform-origin: left;
}
	
	.wp-block-post-template.columns-3, .wp-block-query-loop.columns-3 {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
	
	.wp-block-group.donate-grid > .wp-block-group.offset-left {
		padding-left: 0 !important;
	}
	.wp-block-group.donate-grid > .wp-block-group.offset-right {
		padding-right: 0 !important;
	}
	
}

@media only screen and (min-width: 1px) and (max-width: 998px)  {
	
	.quicklinks-charity .wp-block-spacer {
		height:var(--wp--preset--spacing--30) !important;
	}
	
	footer .contact-detail.field-address span {
		display: none;
	}
	
	:root {
		--wp--preset--spacing--80: 4rem;
	}
	
	:root .wp-block-media-text:not(.has-background) .wp-block-media-text__content {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}
	
	body .wp-block-acf-testimonials img {
    top: 0;
	}
	
	.wp-block-columns.newsletter {
		padding: var(--wp--preset--spacing--40) !important;
	}

}

@media only screen and (min-width: 1px) and (max-width: 900px)  {


	body .wp-block-acf-testimonials .testimonial-inner p:last-child,
	.wp-block-acf-testimonials .testimonial-inner .text {
		width: 100%;
	}
	
	body .wp-block-acf-testimonials img {
		position: unset;
		width: 100px;
		margin-top: 30px;
	}
	
	.wp-block-acf-testimonials .button-arrows {
    position: absolute;
    bottom: 0;
    left: 120px;
		z-index: 1;
		gap: 20px;
	}
	
	body .wp-block-acf-testimonials .wp-element-button {
		white-space: nowrap;
	}
	
	.wp-block-group.impact-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	
}


@media only screen and (min-width: 1px) and (max-width: 880px) {
	
	.wp-block-media-text.is-style-larger-image {
		margin-right: calc(-1 * var(--wp--style--root--padding-left)) !important;
        margin-left: calc(-1 * var(--wp--style--root--padding-left)) !important;
	}
	
	.wp-block-media-text.is-style-larger-image .wp-block-columns > .wp-block-column:first-child {
		display: none;
	}  

	.wp-block-media-text.is-style-larger-image:not(.has-media-on-the-right) figure.wp-block-media-text__media {
		margin-left: 0;
	}
	.wp-block-media-text.is-style-larger-image.has-media-on-the-right figure.wp-block-media-text__media {
		margin-right: 0;
	}
	.wp-block-media-text.is-style-larger-image:not(.has-media-on-the-right) figure.wp-block-media-text__media img {
    width: 50vw;
    right: 0;
	}
	.wp-block-media-text.is-style-larger-image.has-media-on-the-right figure.wp-block-media-text__media img {
    width: 50vw;
    left: 0;
	}
	.wp-block-media-text.is-style-larger-image:not(.has-media-on-the-right) .wp-block-media-text__content {
    margin-left: 0;
	}
	.wp-block-media-text.is-style-larger-image.has-media-on-the-right .wp-block-media-text__content {
    margin-right: 0;
	}
	
		.wp-block-columns.icon-columns-4 .wp-block-column.icon-box {
		flex-basis: 100%;
		margin-left: calc(-1 * var(--wp--style--root--padding-left));
		margin-right: calc(-1 * var(--wp--style--root--padding-right));
	}
	
		.wp-block-cover.page-header,
	:root body .homepage-slider.wp-block-acf-swiper,
	:root body .homepage-slider.wp-block-acf-swiper .swiper-slide,
	:root body .homepage-slider.wp-block-acf-swiper .swiper-slide img {
    	min-height: 400px !important;
	}
	
}

@media only screen and (min-width: 1px) and (max-width: 820px)  {
	
	footer .footer-wrap {
        flex-wrap: wrap;
    }
	
	footer .wp-block-group.donate {
		flex-basis: 100%;
    	order: -1;
	}
	
	.wp-block-columns.icon-columns {
		flex-wrap: wrap !important;
	}
	
	.wp-block-columns.icon-columns .wp-block-column.icon-box {
		flex-basis: 100%;
		margin-left: calc(-1 * var(--wp--style--root--padding-left));
		margin-right: calc(-1 * var(--wp--style--root--padding-right));
	}
	
	.wp-block-group.partners {
		flex-wrap: wrap !important;
	}
	
	.wp-block-group.partners > *:first-child {
		flex: 100%;
	}
	
}

/* 
Columns
*/
@media only screen and (min-width: 1px) and (max-width: 782px)  {

/*	:root {
		--wp--preset--spacing--20: 0.75rem;
		--wp--preset--spacing--30: 2rem;
		--wp--preset--spacing--40: 3rem;
		--wp--preset--spacing--50: 4rem;
		--wp--preset--spacing--60: 5rem;
		--wp--preset--spacing--70: 6.5rem;
		--wp--preset--spacing--80: 8rem;
	}*/
	
	header .wp-block-social-links {
		display: none;
	}
	
	:root body {
	--wp--preset--spacing--50: 3rem !important;
	}
	
	.wp-block-group.donate-now {
		margin-left: calc(-1 * var(--wp--style--root--padding-left)) !important;
	}
	.wp-block-group.donate-now > .wp-block-group {
		padding-right: 0 !important;
	}
	
	.wp-block-group.teal-icons {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	
	.hide-on-mobile {
		display: none;
	}
	
}

@media only screen and (min-width: 1px) and (max-width: 781px)  {

	.wp-block-columns.team-tiles .wp-block-column.offset-right {
		margin-left: calc(-1 * var(--wp--style--root--padding-left)) !important;
	}
	.wp-block-columns.team-tiles .wp-block-column.offset-left {
		margin-right: calc(-1 * var(--wp--style--root--padding-left)) !important;
	}
	.wp-block-columns.team-tiles .wp-block-column.offset-left.negative-margin-top {
		margin-top: 0 !important;
	}
	
	.wp-block-group.ambassador {
		padding-top: 0 !important;
	}
	
}

@media only screen and (min-width: 1px) and (max-width: 670px)  {
	.wp-block-group.impact-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	
	.wp-block-post-template.columns-3, .wp-block-query-loop.columns-3 {
	grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
	}
	
	.wp-block-group.donate-grid {
		grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
	}
	
	.wp-block-group.donate-grid .wp-block-column.offset-left::before {
		width: 100vw;
		left: 50%;
		transform: translateX(-50%);
	}
	
	.wp-block-group.donate-grid figure.fourth {
		order: 4;
	}
	
	.wp-block-group.donate-grid figure {
		aspect-ratio: 1 !important;
	}
	
}

/* 
Media & Text
*/
@media only screen and (min-width: 1px) and (max-width: 620px)  {
	
	footer .footer-wrap > * {
		flex-basis: 100%;
	}
	
	footer .wp-block-site-logo {
		gap: 20px;
	}
	
	footer .wp-block-site-logo .wp-block-image img {
		filter: none !important;
	}

}

@media only screen and (min-width: 1px) and (max-width: 600px)  {

	.wp-block-media-text.has-media-on-the-right:not(.has-background) > figure {
		margin-bottom: var(--gap-width);
	}
	
	.wp-block-media-text.alignwide.has-media-on-the-right:not(.has-background) .wp-block-media-text__content {
		padding-right: 0;
	}
	
	:root :where(.wp-block-buttons) {
    margin-top: 2rem;
	}
	
	.wp-block-media-text.is-style-offset.has-media-on-the-right figure.wp-block-media-text__media {
    margin-left: calc(-1 * var(--wp--style--root--padding-left));
	}
	
	.wp-block-acf-testimonials .material-symbols.prev, .wp-block-acf-testimonials .material-symbols.next {
    width: 2rem;
	}
	
	.wp-block-acf-testimonials .wp-block-button span {
		display: none;
	}
	
	.wp-block-media-text.has-background > .wp-block-media-text__content {
		padding: var(--wp--style--root--padding-left);
	}
	
	.wp-block-media-text.is-style-larger-image figure.wp-block-media-text__media img {
		width: 100% !important;
	}
	
	.wp-block-media-text figure.wp-block-media-text__media span.image-alt-text {
    left: 30px;
	}
	
	.wp-block-acf-menu ul.mobile-navigation-container > li {
    padding-left: var(--wp--style--root--padding-right) !important;
    padding-right: var(--wp--style--root--padding-right) !important;
}
	
}

@media only screen and (min-width: 1px) and (max-width: 560px)  {

	:root body {
		--wp--style--root--padding-right: 2rem !important;
	    --wp--style--root--padding-left: 2rem !important;
	}
	
	.wp-block-group.offset-left {
		margin-right: calc(-1 * var(--wp--style--root--padding-right)) !important;
	}
	.wp-block-group.offset-right {
		margin-left: calc(-1 * var(--wp--style--root--padding-left)) !important;
	}
	
}

@media only screen and (min-width: 1px) and (max-width: 530px)  {

	header .wp-block-group.search-container,
	header .wp-block-group.contact-details-socials {
		display: none;
	}
	
	header .header-nav {
		background-color: white !important;
	}
	
	header .wp-block-acf-menu {
		position: absolute;
		right: var(--wp--style--root--padding-right);
	}
	
	header .wp-block-site-logo {
    z-index: 5 !important;
	}
	
	.wp-block-acf-menu ul.mobile-navigation-container > li:first-child > a {
    	padding-top: calc(var(--mobile-menu-typography-padding-top-bottom) * 1.5);
	}
	
	header .logo-container {
		padding-top: 10px !important;
		padding-bottom: 10px !important;
	}
	
}

@media only screen and (min-width: 1px) and (max-width: 400px)  {

	.wp-block-group.impact-grid {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}
	
}