/*
Theme Name:     generatepress-child
Description:    Generatepress child theme for Ahuroa Red Devon
Author:         Pivot Design
Template:       generatepress
*/


:root {
	--ahuroa-primary: #8e2828;
	--ahuroa-red: #8e2828;
	--ahuroa-brown: #783814;
	--ahuroa-green: #535600;
	--ahuroa-light-brown: #c5ad9d;
	--ahuroa-beige: #ece3de;
	--black: #000;
	--white: #fff;
	--menu-content-shadow: 0 0 5px var(--white);
	--menu-padding-h: 0.8rem;
	--hero-video-offset-h: -40rem;
	--hero-video-offset-v: 0;
	--font-red-hat: "Red Hat Display", -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

/*body {
	color: #646364;
}
*/

/*
h1 {
	font-weight: bold;
}
h2 {
	font-weight: 350;
}
*/
body, h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-red-hat);
}
h1, h3 {
	color: var(--ahuroa-red);
	font-weight: bold;
}

h2 + h1 {
	margin-top: -1rem;
}
h4 {
	color: var(--ahuroa-red);
	font-size: 1.1rem;
	font-weight: bold;
	margin-bottom: 0;
}
h5 {
	font-size: 19px;
	font-weight: bold;
	letter-spacing: 1px;
}

/* Main subtitle */
h1.entry-title + h3,
.entry-content h1:first-child + h3,
.archive.category .page-title:after {
	color: var(--ahuroa-red);
	display: block;
	font-size: 1.4rem;
	font-weight: bold;
	text-transform: none;
}
.entry-content h1:first-child + h3 {
	margin-top: -20px;
}
.archive.category .page-title:after {
	content: "diary";
	line-height: 1.5rem;
}


.wp-block-file .wp-block-file__button {
	background: var(--ahuroa-primary);
	border-radius: 0;
	transition: all 200ms;
}



/****************************************
*  N E W S                              *
****************************************/
@media (min-width: 600px) {
	.archive .post-image {
		float: right;
		margin: 0 0 1rem 2rem;
		width: 40%;
	}
}
@media (min-width: 800px) {
	.archive .post-image {
		max-width: 250px;
		width: 30%;
	}
}
.byline,
.archive.category footer.entry-meta,
.single-post .featured-image {
	display: none !important;
}
article {
	clear: both;
}
article.post header.entry-header {
	border-top: 1px solid #ccc;
	margin-top: -2rem;
	padding-top: 2rem;
}
.entry-title a {
	color: var(--ahuroa-red);
	font-size: 1.7rem;
	font-weight: 700;
}
.entry-meta {
	font-size: 1rem;
	font-style: italic;
	margin: 0;
}



/****************************************
*  C U S T O M   C O L O U R S          *
****************************************/
.has-ahuroa-red-background-color {
	background: var(--ahuroa-red);
}
.has-ahuroa-brown-background-color {
	background: var(--ahuroa-brown);
}
.has-ahuroa-green-background-color {
	background: var(--ahuroa-green);
}
.has-ahuroa-light-brown-background-color {
	background: var(--ahuroa-light-brown);
}
.has-ahuroa-beige-background-color {
	background: var(--ahuroa-beige);
}
.has-white-background-color {
	background: var(--white);
}
.has-black-background-color {
	background: var(--black);
}

.has-ahuroa-red-color {
	color: var(--ahuroa-red);
}
.has-ahuroa-brown-color {
	color: var(--ahuroa-brown);
}
.has-ahuroa-green-color {
	color: var(--ahuroa-green);
}
.has-ahuroa-light-brown-color {
	color: var(--ahuroa-light-brown);
}
.has-ahuroa-beige-color {
	color: var(--ahuroa-beige);
}
.has-white-color {
	color: var(--white);
}
.has-black-color {
	color: var(--black);
}



/****************************************
*  P A N E L   H O V E R                *
****************************************/
.home .homepage-buttons .wp-block-button,
.subpages.grid a,
.wp-block-gallery.links a {
	transition: all 200ms;
}
.home .homepage-buttons .wp-block-button:hover,
.subpages.grid a:hover,
.wp-block-gallery.links a:hover {
	box-shadow: 0 0.2rem 0.5rem black;
	filter: brightness(1.1);
	transform: translateY(-0.3rem);
}
.blocks-gallery-grid a {
	position: relative;
}
.wp-block-gallery:not(.links) .blocks-gallery-grid a.image:after {
	background: url(imgs/magnifying-glass.png) bottom right no-repeat;
	background-size: 2rem;
	bottom: 1rem;
	content: "";
	left: 0;
	position: absolute;
	right: 1rem;
	top: 0;
	transition: all 200ms;
}
.blocks-gallery-grid a:hover:after {
	background-size: 3rem;
}



/****************************************
*  M E N U S                            *
****************************************/
#menu-primary-menu li.menu-item-has-children a {
	padding-right: var(--menu-padding-h);
}
#menu-primary-menu li a {
	color: var(--black);
	font-family: var(--font-red-hat);
	font-size: 0.8rem;
	font-weight: 700;
	padding: 0.4rem var(--menu-padding-h);
}
/* Top level only */
#menu-primary-menu > li > a {
	background: transparent !important;
	color: var(--black);
	font-size: 0.9rem;
	font-weight: 900;
	line-height: 30px;
	padding: 1rem var(--menu-padding-h);
	text-shadow: var(--menu-content-shadow);
	text-transform: uppercase;
}
#menu-primary-menu > li > a:after {
	border-top: 0 solid var(--black);
	bottom: 0.8rem;
	content: "";
	left: var(--menu-padding-h);
	position: absolute;
	right: var(--menu-padding-h);
	transition: all 100ms;
}
#menu-primary-menu .menu-item.is-heading.menu-item-has-children > a {
	background: unset !important;
	color: var(--ahuroa-red);
	cursor: default;
	font-weight: bold;
	margin-top: 0.5rem;
	pointer-events: none;
	text-transform: uppercase;
}
#menu-primary-menu .is-heading.menu-item-has-children > ul.sub-menu {
	box-shadow: unset;
	float: unset;
	height: unset;
	left: unset;
	opacity: 1;
	margin-bottom: 1rem;
	position: relative;
}
#menu-primary-menu .is-heading.menu-item-has-children > ul.sub-menu > li > a:before {
	/* content: " > "; */
	font-weight: bold;
	/* padding-left: 1rem; */
}
#menu-primary-menu ul.sub-menu li a {
	padding: 0.75rem var(--menu-padding-h) 0.75rem;
}
@media (max-width: 768px) {
	#menu-primary-menu > li.current-menu-item > a,
	#menu-primary-menu > li.current-page-ancestor > a {
		position: relative;
	}
	#menu-primary-menu > li.current-menu-item > a:after,
	#menu-primary-menu > li.current-page-ancestor > a:after {
		border-top: 4px solid var(--ahuroa-red);
		bottom: 1rem;
		content: "";
		left: var(--menu-padding-h);
		position: absolute;
		width: 1.6rem;
	}
	.main-navigation.toggled .main-nav ul ul {
		visibility: visible;
	}
	.main-navigation ul ul {
		box-shadow: unset;
	}
	#menu-primary-menu > li > ul {
		padding-left: 1rem;
	}
}
@media (min-width: 769px) {
	#menu-primary-menu li.menu-item-has-children .dropdown-menu-toggle {
		display: none;
	}
	#menu-primary-menu > li[class*="current-menu-"] > a:after,
	.archive.category #menu-primary-menu > .menu-item.news a:after,
	.single-post #menu-primary-menu > .menu-item.news a:after {
		border-top: 4px solid var(--ahuroa-red);
		left: auto;
		width: 1.6rem;
	}
	#menu-primary-menu > li:not([class*="current-menu-"]) > a:hover:after {
		border-top: 4px solid var(--black);
		left: var(--menu-padding-h);
		width: unset;
	}
	.main-navigation ul ul {
		width: auto;
	}
	#menu-primary-menu > li > .sub-menu {
		background: var(--white) !important;
		/* border: 1px solid var(--black); */
		box-shadow: 0 1px 15px -4px #999;
		width: 200px;
	}
	#menu-primary-menu > li > .sub-menu:before,
	#menu-primary-menu > li > .sub-menu:after {
		background: unset;
		border-bottom: 1rem solid #ddd;
		border-left: 1rem solid transparent;
		border-right: 1rem solid transparent;
		content: "";
		display: block;
		height: 0;
		left: 2rem;
		position: absolute;
		top: -1rem;
		width: 0;
		z-index: 99999;
	}
	#menu-primary-menu > li > .sub-menu:after {
		border-bottom: 1rem solid var(--white);
		top: -0.9rem;
	}


	#menu-primary-menu .sub-menu {
		text-shadow: unset;
	}
	#menu-primary-menu .sub-menu a {
		text-shadow: unset;
	}
}



/****************************************
*  H E A D E R                          *
****************************************/
.site-logo {
	position: relative;
	z-index: 9;
}
.site-logo .is-logo-image {
	filter: drop-shadow(var(--menu-content-shadow));
}
.main-navigation, .main-navigation ul {
	background-color: transparent !important;
}

.page.has-video-header .page-header-image,
.page.hide-header-image .page-header-image {
	display: none;
}
.page.show-header-image .page-header-image {
	margin: 0;
	max-width: 100%;
	padding: 0;
}
@media (min-width: 769px) {
	.page.show-header-image #masthead,
	.page.has-video-header #masthead {
		background: unset;
		position: absolute;
		width: 100%;
	}
}
@media (min-width: 769px) {
	#site-navigation {
		padding-left: 3rem;
	}
}



/****************************************
*  F O O T E R                          *
****************************************/
.site-info {
	background: var(--ahuroa-red);
}



/****************************************
*  R E S P O N S I V E   C O L U M N S  *
****************************************/
@media (max-width: 598px) {
	.wp-block-column + .wp-block-column {
		margin-top: 2rem;
	}
}



/****************************************
*  H O M E   P A G E                    *
****************************************/
/* Buttons */
.home .homepage-buttons {
	flex-wrap: wrap;
	z-index: 9999;
}
.home .homepage-buttons .wp-block-button {
	margin: 0 !important;
	transition: all 200ms;
	width: 100%;
}
.home .homepage-buttons a {
	display: block;
	font-family: var(--font-red-hat);
	font-size: 1.1rem;
	font-weight: bold;
	letter-spacing: 0.05rem;
	padding: 1.75rem 1rem;
	white-space: nowrap;
	width: 100%;
}
.home .homepage-buttons a:after {
	bottom: -0.2rem;
	content: " >";
	font-size: 1.8rem;
	position: relative;
}

.home .featured-image.page-header-image {
	height: 100%;
}


.homepage-hero > div {
	padding: 0;
}
.homepage-hero .video-holder {
	width: 100%;
	height: 0;
	padding-bottom: 56.4%;
	position: relative;
	overflow: hidden;
}
.homepage-hero .video-holder iframe {
	position: absolute;
	top: -3%;
	right: -2%;
	left: -2%;
	bottom: -2%;
	width: 105%;
	height: 105%;
}
.homepage-hero .hero-overlay h1 {
	color: var(--white);
	font-size: 1.5rem;
	font-weight: bold;
	margin-bottom: 0.5rem;
}
.homepage-hero .hero-overlay p {
	font-weight: bold;
}
@media (max-width: 599px) {
	.home h1 {
		color: var(--ahuroa-red) !important;
		padding-bottom: 2rem;
	}
	.home .inside-article {
		padding: 0 !important;
	}
}

@media (min-width: 400px) {
	.home .homepage-buttons .wp-block-button {
		width: 50%;
	}
}

@media (min-width: 600px) {
	.home .site-header {
		position: static;
	}
	.home .entry-content {
		display: flex;
		flex-direction: column;
		position: absolute;
		top: 0; right: 0; bottom: 0; left: 0;
	}
	.home .entry-content .homepage-hero {
		flex-grow: 1;
		margin: 0;
		position: relative;
	}
	.home .entry-content .homepage-hero .wp-block-group__inner-container {
		display: flex;
		height: 100%;
		flex-direction: column;
		margin: 0;
		max-width: unset;
		padding: 0;
	}
	.home .entry-content .homepage-hero .wp-block-embed {
		flex-grow: 1;
	}
	.home .site-header,
	.home .inside-article,
	.home .comments-area,
	.home .page-header,
	.home .container,
	.home .paging-navigation,
	.home .inside-page-header {
		background: transparent;
	}
	.home .site-footer {
		display: none;
	}

	.homepage-hero .hero-overlay {
		color: var(--white);
		columns: var(--white);
		margin: 0 auto;
		max-width: 800px;
		padding-bottom: 2rem;
		position: relative;
		text-align: center;
		text-shadow: 0 0 3px black;
	}
	.homepage-hero .hero-overlay h1 {
		font-size: 1.75rem;
	}
	.homepage-hero .hero-overlay p {
		font-size: 1rem;
	}

	.homepage-hero .wp-block-embed__wrapper {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}

	.home .homepage-hero .video-wrapper {
		flex-grow: 1;
	}
	.home {
		overflow: hidden;
	}
	.home .entry-content .homepage-buttons .wp-block-button {
		width: unset;
	}
	.home .entry-content .homepage-buttons a {
		font-size: 1.3rem;
	}
	.homepage-hero .video-holder {
		bottom: var(--hero-video-offset-v);
		height: unset;
		left: var(--hero-video-offset-h);
		padding: unset;
		position: fixed;
		right: var(--hero-video-offset-h);
		top: var(--hero-video-offset-v);
		width: unset;
		z-index: -9;
	}
	.homepage-hero .video-holder iframe {
		bottom: 0;
		height: 100%;
		left: 0;
		pointer-events: none;
		right: 0;
		top: 0;
		width: 100%;
		width: 100%;
	}
}
@media (min-width: 600px) and (min-aspect-ratio: 858/485) {
	:root {
		--hero-video-offset-h: 0;
		--hero-video-offset-v: -40rem;
	}
}


.video-holder {
	background: transparent 50% 50% no-repeat;
	background-size: cover;;
}
.video-wrapper.smaller {
	width: 100%;
}
.video-wrapper.smaller .video-holder {
	height: 0;
	padding-bottom: 56.4%;
	position: relative;
}
.video-wrapper.smaller .video-holder iframe {
	bottom: 0;
	height: 100%;
	left: 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	width: 100%;
}
@media (min-width: 900px) {
	:root {
		--hero-small-video-offset-h: 0;
		--hero-small-video-offset-v: -40rem;
	}
	.video-wrapper.smaller {
		height: 50vh;
		overflow: hidden;
		position: relative;
	}
	.video-wrapper.smaller .video-holder {
		bottom: var(--hero-small-video-offset-v);
		height: unset;
		left: var(--hero-small-video-offset-h);
		padding: unset;
		position: absolute;
		right: var(--hero-small-video-offset-h);
		top: var(--hero-small-video-offset-v);
		width: unset;
		z-index: -9;
	}
}



.home .hero-overlay * {
	margin: 0;
}
.home .hero-overlay {
	padding-left: 1rem;
	padding-right: 1rem;
}
.home .entry-content .homepage-buttons {
	display: flex;
	margin-bottom: 0;
}
.home .entry-content .homepage-buttons > * {
	flex-grow: 1;
	margin: 0 0 0.5em 0;
}



/****************************************
*  P A G E   H E A D E R   I M A G E    *
****************************************/
.page-header-image {
	height: max(min(40vw, 42vh), 250px); /* max(min(35vw, 50vh), 250px); */
	/* Make it go full width
	margin: 0 !important;
	max-width: unset !important; */
	/* Make it contained */
	margin-top: 0 !important;
}
.page-header-image img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}
@media (min-width: 800px) {
	.page-header-image {
		box-sizing: border-box;
		padding: 0 40px;
	}
}
@media (min-width: 800px) {
	.site-info {
		text-align: left;
	}
	.byline {
		float: right;
	}
}



/****************************************
*  G A L L E R Y                        *
****************************************/
.blocks-gallery-grid .blocks-gallery-image, .blocks-gallery-grid .blocks-gallery-item, .wp-block-gallery .blocks-gallery-image, .wp-block-gallery .blocks-gallery-item {
	flex-grow: unset;
}



/****************************************
*  L I S T I N G S                      *
****************************************/
.listings-list.grid h3 {
	background: var(--ahuroa-red);
	color: var(--white);
	font-size: 1.7rem;
	margin: 0;
	padding: 1.5rem 1rem;
}
.listings-list.grid .content {
	background: var(--ahuroa-beige);
	font-size: 0.9rem;
	padding: 1rem;
}
.listings-list.grid .content label {
	font-weight: 900;
}
.listings-list.grid .content .breedplan-link-wrap a {
	color: var(--black);
	display: block;
	font-weight: 900;
	margin-top: 0.5rem;
}
.listings-list.grid .content .description {
	margin-top: 0.75rem;
}
.listings-list.grid .content .description :last-child {
	margin-bottom: 0;
}



/****************************************
*  C H I L D   P A G E   G R I D        *
****************************************/
.subpages.grid a,
.listings-list.grid .image-wrap {
	display: block;
	height: 0;
	overflow: hidden;
	padding-bottom: 80%;
	position: relative;
}
.listings-list.grid .image-wrap {
	padding-bottom: 66%;
}
.subpages.grid .thumb-wrap,
.listings-list.grid .thumb-wrap {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}
.subpages.grid .thumb-wrap img,
.listings-list.grid .thumb-wrap img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}
.subpages.grid h3,
.wp-block-gallery.links figcaption {
	background: unset;
	bottom: 0;
	color: var(--white);
	font-size: 1.4rem;
	font-weight: bold;
	margin: 0;
	padding: 0.5rem 0.5rem 1rem 1rem;
	pointer-events: none;
	position: absolute;
	text-align: left;
	text-shadow: 0 0 3px black;
}
/* Play button */
.subpages.grid.video-links .thumb-wrap:after {
	background: transparent url(imgs/play-icon.png) no-repeat 50% 50%;
	background-size: 70px;
	color: blue;
	content: "";
	height: 100%;
	left: 0;
	pointer-events: none;
	position: absolute;
	top: 0;
	width: 100%;
}
.subpages.grid .no-image a {
	background: var(--ahuroa-beige);
}
.subpages.grid .no-image a:hover h3 {
	color: var(--ahuroa-light-brown);
}
@media (min-width: 1200px) {
	.subpages.grid h3,
	.wp-block-gallery.links figcaption {
		padding: 1.5rem 1.5rem 2rem 2rem;
	}
}
@media (max-width: 499px) {
	.blocks-gallery-grid .blocks-gallery-image,
	.blocks-gallery-grid .blocks-gallery-item,
	.wp-block-gallery .blocks-gallery-image,
	.wp-block-gallery .blocks-gallery-item {
		margin: 0 0 1rem 0;
		width: 100%;
	}
}



/****************************************
*  C O N T E N T   I M A G E S          *
****************************************/
figure.cover {
	height: 100%;
}
figure.cover img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}
figure.cover-left img {
	object-position: 0% 50%;
}
figure.cover-top-left img {
	object-position: 0% 0%;
}
figure.cover-bottom-left img {
	object-position: 0% 100%;
}
figure.cover-right img {
	object-position: 100% 50%;
}
figure.cover-top-right img {
	object-position: 100% 0%;
}
figure.cover-bottom-right img {
	object-position: 100% 100%;
}

.wp-block-gallery:not(.links) a {
	transition: all 200ms;
}
.wp-block-gallery:not(.links) a:hover {
	box-shadow: 0 0.2rem 0.5rem black;
	filter: brightness(1.1);
}



/****************************************
*  C O N T A C T   F O R M              *
****************************************/
.form-row {
	padding-top: 2rem;
	position: relative;
}
.form-row input ~ label,
.form-row textarea ~ label {
	font-size: 0.8rem;
	font-weight: bold;
	left: 0;
	opacity: 1;
	position: absolute;
	top: 0.75rem;
	transition: 200ms all;
}
.form-row input:placeholder-shown ~ label,
.form-row textarea:placeholder-shown ~ label {
	left: 1rem;
	opacity: 0;
	top: 2.75rem;
}



/****************************************
*  S T I C K Y   F O O T E R            *
****************************************/
html, body {
	height: 100%;
}
body:not(.has-video-header) {
	display: flex;
	flex-direction: column;
}
#page {
	flex: 1 0 auto;
	width: 100%;
}
.admin-bar #page {
	margin-bottom: -32px;
}
.site-header, .site-footer {
	flex-shrink: 0;
}
