/*************************************************
0 - 576 - SMALL
*************************************************/
@media all and (max-width: 576px) {
	.site-branding #logo img {}
	.mobile-nav { top:20px;}
	.hide-small{ display:none !important;}
	.mobile-nav .nav-heading { display:none;}
	.social-box, .post-meta { width:100%; text-align:center;}
	.social-box { margin:50px 0 0 0;}
}
/*************************************************
576 - 768 - MEDIUM
*************************************************/
@media all and (min-width: 576px) and (max-width: 768px){
	.site-branding #logo img { max-height:70px;}
	.hide-medium{ display:none !important;}
}
/*************************************************
768 - 992 - LARGE
*************************************************/
@media all and (min-width: 768px) and (max-width: 992px){
	.hide-large{ display:none !important;}
}
/*************************************************
992 - 1200 - EXTRA LARGE
*************************************************/
@media all and (min-width: 992px) and (max-width: 1200px){
	.hide-extra-large { display:none !important;}
	main#content .page-content article.post { flex: calc(50% - 40px); max-width: calc(50% - 40px);}
}
/*************************************************
1200 -> - DESKTOP
*************************************************/
@media all and (min-width:1200px){
	.hide-desktop {display:none !important;}
}
/*************************************************
MOBILE NAV - 0 - 992
*************************************************/
@media all and (max-width: 1370px){	
	#site-header .site-social {
		display:none;
	}

	nav.site-navigation {
		float:none;
	}
}

/*************************************************
MOBILE OFF-CANVAS DRILL-DOWN NAVIGATION
*************************************************/
@media all and (max-width: 1370px) {
	body.menu-active {
		overflow:hidden;
	}

	.mobile-menu-overlay {
		z-index:998;
		background:rgba(17, 24, 39, 0.56);
		backdrop-filter:blur(2px);
		-webkit-backdrop-filter:blur(2px);
		transition:
			opacity 0.28s ease,
			visibility 0.28s ease,
			backdrop-filter 0.28s ease,
			-webkit-backdrop-filter 0.28s ease;
	}

	body.menu-overlay-active .mobile-menu-overlay {
		opacity:1;
		visibility:visible;
	}

	nav.site-navigation {
		position:static;
	}

	.header-2 nav.site-navigation {
		position:static;
		flex:0 0 0;
		width:0;
		margin-left:0;
	}

	.header-2 .mobile-nav {
		margin-left:auto;
		margin-right:0;
	}

	.menu-main-menu-container {
		--drawer-width:min(88vw, 390px);
		--drawer-header-height:72px;
		--drawer-footer-height:0px;
		box-sizing:border-box;
		position:fixed;
		top:0;
		right:0;
		left:auto;
		width:var(--drawer-width);
		height:100dvh;
		padding:0;
		z-index:999;
		background:var(--mobile-menu-colour);
		color:var(--text-colour);
		box-shadow:-24px 0 60px rgba(17, 24, 39, 0.22);
		overflow:hidden;
		contain:layout paint;
		transform:translate3d(102%, 0, 0);
		transition:transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
		will-change:transform;
	}

	.header-2 nav.site-navigation .menu-main-menu-container,
	.header-1 nav.site-navigation .menu-main-menu-container,
	.header-3 nav.site-navigation .menu-main-menu-container {
		width:var(--drawer-width);
	}

	body.menu-active .menu-main-menu-container,
	.menu-active .menu-main-menu-container,
	body.menu-active .mobile-nav .menu-main-menu-container {
		right:0;
		transform:translate3d(0, 0, 0);
	}

	.drawer-header {
		height:var(--drawer-header-height);
		padding:0 18px 0 24px;
		display:flex;
		align-items:center;
		justify-content:end;
		border-bottom:1px solid var(--border-colour);
		background:var(--mobile-menu-colour);
		position:relative;
		z-index:3;
	}

	.drawer-header strong {
		font-size:18px;
		color:var(--text-colour);
	}

	.drawer-close {
		position:relative;
		width:50px;
		min-width:50px;
		height:50px;
		padding:0;
		border:none;;
		border-radius:8px;
		display:flex;
		align-items:center;
		justify-content:center;
		cursor:pointer;
	}
	.drawer-close,
	.drawer-close:hover,
	.drawer-close:focus {
		background:var(--surface-muted);
	}
	.drawer-close span,
	.drawer-close span:before {
		content:"";
		width:24px;
		height:2px;
		background:var(--mobile-menu-text-colour);
		display:block;
		position:absolute;
		left:50%;
		top:50%;
		transform:translate(-50%, -50%) rotate(45deg);
		transform-origin:center;
	}

	.drawer-close span:before {
		left:0;
		top:0;
		transform:rotate(90deg);
	}

	.menu-main-menu-container ul.menu,
	.menu-main-menu-container ul.sub-menu {
		box-sizing:border-box;
		width:var(--drawer-width);
		max-width:none;
		height:calc(100dvh - var(--drawer-header-height) - var(--drawer-footer-height));
		position:absolute;
		top:var(--drawer-header-height);
		right:auto;
		bottom:0;
		left:0;
		left:0;
		margin:0;
		padding:0;
		list-style:none;
		display:block;
		background:var(--mobile-menu-colour);
		overflow-y:auto;
		overscroll-behavior:contain;
		opacity:1;
		visibility:visible;
		white-space:normal;
		border-radius:0;
		transform:translate3d(100%, 0, 0);
		transition:transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
		will-change:transform;
	}

	.menu-main-menu-container ul.sub-menu {
		top:0 !important;
		height:calc(100dvh - var(--drawer-header-height) - var(--drawer-footer-height)) !important;
	}

	.menu-main-menu-container ul.menu.is-current,
	.menu-main-menu-container ul.sub-menu.is-current {
		transform:translate3d(0, 0, 0);
		z-index:2;
	}

	.menu-main-menu-container ul.menu.is-parent,
	.menu-main-menu-container ul.sub-menu.is-parent {
		transform:translate3d(0, 0, 0);
		z-index:1;
	}

	.menu-main-menu-container ul.menu.is-next,
	.menu-main-menu-container ul.sub-menu.is-next {
		transform:translate3d(100%, 0, 0);
		z-index:3;
	}

	.menu-main-menu-container ul.menu li,
	.menu-main-menu-container ul.sub-menu li,
	.site-navigation ul.menu li {
		box-sizing:border-box;
		display:flex;
		align-items:center;
		width:100%;
		position:static;
		margin:0;
		padding:0;
		border-bottom:1px solid var(--border-colour);
	}

	.menu-main-menu-container ul.menu li a,
	.menu-main-menu-container ul.sub-menu li a,
	.header-1 .site-navigation ul.menu li a,
	.header-3 .header-bottom .site-navigation ul.menu li a,
	.menu-main-menu-container ul li.menu-item-has-children ul.sub-menu li a {
		min-height:56px;
		padding:20px 40px;
		color:var(--mobile-menu-text-colour);
		font-size:20px;
		line-height:1.3;
		font-weight:700;
		text-transform:none;
		display:flex;
		align-items:center;
		flex:1;
		min-width:0;
		overflow-wrap:anywhere;
		text-decoration:none;
	}

	.menu-main-menu-container ul.menu li a:hover,
	.menu-main-menu-container ul.menu li a:focus,
	.menu-main-menu-container ul.sub-menu li a:hover,
	.menu-main-menu-container ul.sub-menu li a:focus {
		color:var(--primary-colour);
		background:var(--surface-muted);
		outline:none;
	}

	.site-navigation ul.menu li.menu-item-has-children button.toggle-submenu {
		display:none;
	}

	.drawer-next {
		appearance:none;
		display:flex !important;
		width:56px;
		min-width:56px;
		min-height:56px;
		border:0;
		border-radius:0;
		background:#fff;
		display:flex;
		align-items:center;
		justify-content:center;
		cursor:pointer;
	}

	.drawer-next:hover,
	.drawer-next:focus {
		background:var(--surface-muted);
	}

	.drawer-next span {
		display:block;
		width:10px;
		height:10px;
		border-right:2px solid var(--text-muted);
		border-top:2px solid var(--text-muted);
		transform:rotate(45deg);
	}

	.drawer-back-item {
		display:flex !important;
		position:sticky;
		top:0;
		z-index:2;
		background:#fff;
		border-bottom:1px solid var(--border-colour);
		box-shadow:0 10px 18px rgba(17, 24, 39, 0.06);
	}

	.drawer-back {
		appearance:none;
		display:flex !important;
		width:100%;
		min-height:58px;
		padding:0 20px;
		border:0;
		border-radius:0;
		background:#eee;
		color:var(--text-colour) !important;
		display:flex;
		align-items:center;
		gap:14px;
		cursor:pointer;
		text-align:left;
		min-width:0;
	}

	.drawer-back:hover,
	.drawer-back:focus {
		background:#eee !important;
		color:var(--text-colour) !important;
	}

	.drawer-back span {
		display:block;
		width:10px;
		height:10px;
		border-left:2px solid currentColor;
		border-bottom:2px solid currentColor;
		transform:rotate(45deg);
	}

	.drawer-back strong {
		font-size:15px;
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
	}

	.site-navigation ul.menu li > ul,
	.site-navigation ul.menu li:hover > ul,
	.site-navigation ul.sub-menu.active,
	.menu-item-has-children:hover > .sub-menu,
	.menu-item-has-children:focus-within > .sub-menu {
		display:block;
		opacity:1;
		visibility:visible;
	}

	.menu-main-menu-container ul.sub-menu,
	.menu-main-menu-container ul.menu li ul.sub-menu,
	.site-navigation ul.menu li ul ul {
		left:0 !important;
		top:0 !important;
	}

	.menu-main-menu-container ul.menu,
	.menu-main-menu-container ul.sub-menu {
		overflow:visible !important;
	}

	.menu-main-menu-container ul.menu.is-current,
	.menu-main-menu-container ul.sub-menu.is-current {
		overflow-x:hidden !important;
		overflow-y:auto !important;
		-webkit-overflow-scrolling:touch;
	}

	.menu-main-menu-container ul.menu.is-parent,
	.menu-main-menu-container ul.sub-menu.is-parent {
		overflow:visible !important;
	}

	.menu-main-menu-container.has-drawer-footer .drawer-footer {
		box-sizing:border-box;
		display:block;
		position:absolute;
		left:0;
		right:0;
		bottom:0;
		z-index:4;
		padding:18px 24px calc(18px + env(safe-area-inset-bottom));
		background:#fff;
		border-top:1px solid var(--border-colour);
		box-shadow:0 -18px 34px rgba(17, 24, 39, 0.08);
	}

	.drawer-cta {
		display:flex;
		align-items:center;
		justify-content:center;
		min-height:50px;
		padding:20px 18px;
		border-radius:8px;
		background:var(--primary-colour);
		color:#fff !important;
		font-size:18px;
		font-weight:bold;
		line-height:1.2;
		text-align:center;
		text-decoration:none;
	}
	a[href^="tel"].drawer-cta {
		font-weight:bold;
		color:#fff !important;
	}
	.drawer-cta:hover,
	.drawer-cta:focus {
		background:var(--secondary-colour);
		color:#fff !important;
		outline:none;
	}

	.drawer-socials {
		display:flex;
		align-items:center;
		justify-content:center;
		gap:10px;
		list-style:none;
		margin:14px 0 0;
		padding:0;
	}

	.drawer-socials li {
		display:block;
		width:auto;
		border:0;
	}

	.drawer-socials a {
		width:42px;
		height:42px;
		padding:0;
		border-radius:8px;
		background:var(--surface-muted);
		color:var(--primary-colour) !important;
		display:flex;
		align-items:center;
		justify-content:center;
		font-size:20px;
		text-decoration:none;
	}

	.drawer-socials a:hover,
	.drawer-socials a:focus {
		background:var(--primary-colour);
		color:#fff !important;
		outline:none;
	}
}

@media all and (min-width: 576px) and (max-width: 992px) {
	body.blog main#content .page-content,
	body.archive main#content .page-content,
	body.search main#content .page-content {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media all and (max-width: 575px) {
	body.blog main#content .page-content,
	body.archive main#content .page-content,
	body.search main#content .page-content {
		grid-template-columns: 1fr;
		gap:22px;
		padding:0 18px;
		margin:42px auto;
	}
}